/* Firmanager Blog — styled to match the promo site (firmanager.cloud) */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Segoe UI Variable','Segoe UI',-apple-system,BlinkMacSystemFont,system-ui,sans-serif;
  background:#05070d;color:#e9edf5;line-height:1.65;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  background-image:
    radial-gradient(1100px 700px at 50% -100px, #16203a 0%, transparent 60%),
    radial-gradient(900px 700px at 100% 30%, #0e1a35 0%, transparent 65%),
    radial-gradient(900px 800px at 0% 70%, #0b1530 0%, transparent 60%);
  background-attachment:fixed;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
:root{
  --line:rgba(255,255,255,.08);--line-strong:rgba(255,255,255,.16);
  --text:#e9edf5;--text-dim:#9aa4b8;--text-mute:#6b7388;
  --accent:#7fb1ff;
  --tile-bg:linear-gradient(180deg, rgba(255,255,255,.08) 0%, rgba(255,255,255,.02) 100%);
  --tile-bg-hi:linear-gradient(180deg, rgba(255,255,255,.13) 0%, rgba(255,255,255,.04) 100%);
  --radius-lg:18px;--radius-md:14px;--radius-sm:10px;
}

/* NAV */
nav{
  display:flex;justify-content:space-between;align-items:center;
  padding:.9rem 2.5rem;background:rgba(5,7,13,.72);
  border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:100;
  -webkit-backdrop-filter:saturate(140%) blur(18px);backdrop-filter:saturate(140%) blur(18px);
}
.nav-brand{display:flex;align-items:center;gap:.7rem}
.nav-logo{height:34px;width:auto;object-fit:contain;display:block;filter:drop-shadow(0 1px 0 rgba(0,0,0,.5))}
.nav-name{font-size:1.05rem;font-weight:700;letter-spacing:.01em;color:#fff}
.nav-links{display:flex;gap:1.6rem;font-size:.88rem;color:var(--text-dim);align-items:center}
.nav-links a{transition:color .15s}
.nav-links a:hover{color:#fff}
.nav-cta{
  background:linear-gradient(180deg,#ffffff 0%,#cfd6e4 100%);
  color:#0a0f1a !important;padding:.45rem 1.1rem;border-radius:999px;
  font-weight:700;font-size:.85rem;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 6px 18px rgba(160,180,220,.18);
}
.nav-cta:hover{filter:brightness(1.05)}

.wrap{max-width:1080px;margin:0 auto;padding:0 1.5rem}
.article-wrap{max-width:760px;margin:0 auto;padding:0 1.5rem}

/* BLOG HERO */
.blog-hero{text-align:center;padding:4rem 1.5rem 2rem}
.blog-hero .eyebrow{
  display:inline-block;background:linear-gradient(90deg, rgba(52,211,153,.16), rgba(59,130,246,.16));
  border:1px solid var(--line-strong);border-radius:999px;padding:.35rem 1rem;
  color:#a7f3d0;font-size:.8rem;font-weight:600;letter-spacing:.02em;margin-bottom:1.2rem;
}
.blog-hero h1{
  font-family:'Segoe UI Variable Display','Segoe UI',system-ui,sans-serif;
  font-size:clamp(2.2rem,5vw,3.4rem);font-weight:300;line-height:1.02;
  letter-spacing:-.03em;color:#fff;margin-bottom:.8rem;
}
.blog-hero p{color:var(--text-dim);font-size:1.05rem;max-width:560px;margin:0 auto}

/* POST GRID */
.post-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.4rem;padding:2rem 0 4rem}
.post-card{
  background:var(--tile-bg);border:1px solid var(--line);border-radius:var(--radius-lg);
  overflow:hidden;transition:transform .18s, border-color .18s, background .18s;display:flex;flex-direction:column;
}
.post-card:hover{transform:translateY(-4px);border-color:var(--line-strong);background:var(--tile-bg-hi)}
.post-card .thumb{aspect-ratio:16/9;background:linear-gradient(160deg,#3a4358 0%, #1a1f2c 100%);overflow:hidden}
.post-card .thumb img{width:100%;height:100%;object-fit:cover}
.post-card .body{padding:1.2rem 1.3rem 1.4rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.post-card .cat{font-size:.72rem;color:var(--accent);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.post-card h2{font-size:1.2rem;font-weight:600;color:#fff;line-height:1.25;letter-spacing:-.01em}
.post-card p{font-size:.9rem;color:var(--text-dim);flex:1}
.post-card .meta{font-size:.78rem;color:var(--text-mute);margin-top:.3rem}

/* ARTICLE */
article{padding:3rem 0 4rem}
article .eyebrow{color:var(--accent);font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em}
article h1{
  font-family:'Segoe UI Variable Display','Segoe UI',system-ui,sans-serif;
  font-size:clamp(2rem,4.5vw,3rem);font-weight:300;line-height:1.05;letter-spacing:-.03em;color:#fff;margin:.6rem 0 .8rem;
}
article .byline{color:var(--text-mute);font-size:.88rem;margin-bottom:1.6rem}
.article-hero-img{border-radius:var(--radius-lg);border:1px solid var(--line);margin:0 0 2rem;overflow:hidden}
.prose{color:#d6dbe6;font-size:1.05rem}
.prose h2{color:#fff;font-weight:600;font-size:1.6rem;letter-spacing:-.01em;margin:2rem 0 .8rem}
.prose h3{color:#fff;font-weight:600;font-size:1.25rem;margin:1.6rem 0 .6rem}
.prose p{margin:0 0 1.1rem}
.prose ul,.prose ol{margin:0 0 1.2rem 1.4rem}
.prose li{margin:.35rem 0}
.prose a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.prose a:hover{color:#fff}
.prose strong{color:#fff;font-weight:600}
.prose blockquote{border-left:3px solid var(--accent);padding:.4rem 0 .4rem 1.1rem;margin:1.4rem 0;color:var(--text-dim);font-style:italic}
.prose code{background:rgba(255,255,255,.07);border:1px solid var(--line);border-radius:6px;padding:.1rem .4rem;font-size:.9em}
.prose pre{background:#0a0f1a;border:1px solid var(--line);border-radius:var(--radius-md);padding:1rem 1.2rem;overflow-x:auto;margin:0 0 1.2rem}
.prose pre code{background:none;border:none;padding:0}
.prose img{border-radius:var(--radius-md);border:1px solid var(--line);margin:1.2rem 0}
.prose hr{border:none;border-top:1px solid var(--line);margin:2rem 0}
.tags{display:flex;gap:.5rem;flex-wrap:wrap;margin:2rem 0 0}
.tag{background:rgba(255,255,255,.06);color:#d6dbe6;font-size:.72rem;padding:.2rem .7rem;border-radius:999px;border:1px solid var(--line)}
.back-link{display:inline-flex;align-items:center;gap:.4rem;color:var(--text-dim);font-size:.9rem;margin:2.5rem 0 0}
.back-link:hover{color:#fff}

/* CTA */
.blog-cta{
  background:var(--tile-bg-hi);border:1px solid var(--line-strong);border-radius:var(--radius-lg);
  padding:2rem;text-align:center;margin:3rem 0 0;
}
.blog-cta h3{color:#fff;font-size:1.4rem;font-weight:600;margin-bottom:.4rem}
.blog-cta p{color:var(--text-dim);margin-bottom:1.2rem}
.btn-primary{
  display:inline-block;background:linear-gradient(180deg,#ffffff 0%, #cfd6e4 100%);
  color:#0a0f1a;padding:.8rem 1.7rem;border-radius:999px;font-weight:700;font-size:.95rem;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 6px 18px rgba(160,180,220,.18);
}
.btn-primary:hover{filter:brightness(1.05)}

/* FOOTER */
footer{background:#020308;border-top:1px solid var(--line);padding:2.5rem 1.5rem;text-align:center;color:var(--text-mute);font-size:.85rem;margin-top:3rem}
footer a{color:var(--text-dim)}
footer a:hover{color:#fff}
.footer-logo{width:38px;height:38px;object-fit:contain;margin:0 auto .75rem;display:block;opacity:.9}
.footer-brand{font-size:1.05rem;font-weight:600;color:#e9edf5;margin-bottom:.35rem}
.footer-tagline{margin-bottom:.5rem;color:var(--text-mute)}
.footer-links{display:flex;justify-content:center;gap:2rem;margin:1.1rem 0;flex-wrap:wrap}
.footer-copy{margin-top:1.25rem;color:#3a4150}
.footer-legal{margin-top:.35rem;color:#3a4150;font-size:.78rem}

@media(max-width:720px){
  nav{padding:.8rem 1.2rem}
  .nav-links a:not(.nav-cta){display:none}
  .nav-links{gap:.6rem}
}