/* Blog do Almode — estilo premium dark compartilhado (índice + posts) */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --purple:#8B5CF6; --purple-2:#7C3AED; --cyan:#22D3EE; --cyan-2:#00AFCB;
  --bg:#08080F; --bg-2:#0D0D18; --panel:rgba(255,255,255,0.04);
  --stroke:rgba(255,255,255,0.09); --stroke-2:rgba(255,255,255,0.14);
  --text:#ECEBFA; --muted:#9A98C0; --muted-2:#6F6D93;
  --grad:linear-gradient(120deg,#A78BFA 0%,#22D3EE 100%);
}
html{ scroll-behavior:smooth; }
body{ font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif; background:var(--bg); color:var(--muted); line-height:1.75; -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4{ font-family:'Sora',sans-serif; color:var(--text); line-height:1.2; letter-spacing:-0.02em; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
.wrap{ max-width:900px; margin:0 auto; padding:0 24px; }
.wrap-wide{ max-width:1140px; margin:0 auto; padding:0 24px; }
.grad-text{ background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }

nav{ position:sticky; top:0; z-index:100; display:flex; align-items:center; justify-content:space-between;
  padding:14px 28px; background:rgba(8,8,15,0.8); backdrop-filter:blur(16px); border-bottom:1px solid var(--stroke); }
.nav-logo img{ height:28px; }
.nav-menu{ display:flex; align-items:center; gap:26px; }
.nav-menu a{ font-size:0.92rem; font-weight:500; color:var(--muted); }
.nav-menu a:hover{ color:var(--text); }
.btn{ display:inline-flex; align-items:center; gap:8px; font-family:'Sora'; font-weight:600; font-size:0.92rem;
  padding:10px 20px; border-radius:12px; transition:transform .18s, box-shadow .18s; }
.btn:hover{ transform:translateY(-2px); }
.btn-primary{ color:#0A0A14; background:var(--grad); box-shadow:0 8px 24px rgba(124,58,237,0.4); }
.btn-purple{ background:var(--purple-2); color:#fff; }

/* índice */
.blog-head{ text-align:center; padding:80px 0 40px; position:relative; overflow:hidden; }
.blog-head::before{ content:''; position:absolute; top:-160px; left:50%; transform:translateX(-50%); width:600px; height:400px;
  background:radial-gradient(circle,rgba(139,92,246,0.35),transparent 65%); filter:blur(20px); z-index:0; }
.blog-head .kicker{ font-family:'Sora'; font-weight:600; font-size:0.76rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--cyan); position:relative; z-index:2; }
.blog-head h1{ font-size:clamp(2.2rem,5vw,3.4rem); font-weight:800; margin:14px 0 12px; position:relative; z-index:2; }
.blog-head p{ color:var(--muted); position:relative; z-index:2; }
.posts-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; padding:30px 0 90px; }
.post-card{ border-radius:18px; overflow:hidden; background:var(--panel); border:1px solid var(--stroke); transition:transform .2s, border-color .2s; display:flex; flex-direction:column; }
.post-card:hover{ transform:translateY(-5px); border-color:var(--stroke-2); }
.post-card .thumb{ aspect-ratio:16/9; overflow:hidden; background:#111; }
.post-card .thumb img{ width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.post-card:hover .thumb img{ transform:scale(1.05); }
.post-card .body{ padding:22px 20px 24px; display:flex; flex-direction:column; flex:1; }
.post-card .date{ font-size:0.75rem; color:var(--muted-2); margin-bottom:8px; }
.post-card h3{ font-size:1.08rem; font-weight:600; margin-bottom:10px; }
.post-card p{ font-size:0.9rem; color:var(--muted); flex:1; }
.post-card .more{ color:var(--cyan); font-weight:600; font-size:0.85rem; margin-top:14px; }
@media (max-width:860px){ .posts-grid{ grid-template-columns:1fr; } }

/* post */
.article-hero{ position:relative; overflow:hidden; padding:66px 0 30px; }
.article-hero::before{ content:''; position:absolute; top:-160px; right:-80px; width:460px; height:460px;
  background:radial-gradient(circle,rgba(34,211,238,0.22),transparent 65%); filter:blur(20px); z-index:0; }
.article-hero .inner{ position:relative; z-index:2; }
.article-back{ display:inline-flex; align-items:center; gap:7px; font-size:0.85rem; color:var(--muted); margin-bottom:20px; }
.article-back:hover{ color:var(--cyan); }
.article-date{ font-family:'Sora'; font-size:0.78rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--cyan); }
.article-hero h1{ font-size:clamp(1.9rem,4.2vw,2.9rem); font-weight:800; margin:12px 0 20px; }
.article-cover{ border-radius:20px; overflow:hidden; border:1px solid var(--stroke); margin:8px 0 10px; box-shadow:0 30px 80px rgba(0,0,0,0.45); }
.article-cover img{ width:100%; aspect-ratio:16/9; object-fit:cover; }
.prose{ padding:40px 0 20px; font-size:1.06rem; }
.prose p{ margin:0 0 20px; }
.prose h2,.prose h3{ color:var(--text); margin:36px 0 14px; font-size:1.4rem; }
.prose h4{ color:var(--text); margin:28px 0 10px; font-size:1.12rem; }
.prose ul,.prose ol{ margin:0 0 22px; padding-left:22px; }
.prose li{ margin:0 0 10px; }
.prose strong{ color:var(--text); }
.prose a{ color:var(--cyan); text-decoration:underline; }
.article-cta{ margin:40px 0 90px; padding:34px; border-radius:22px; text-align:center;
  background:linear-gradient(135deg,rgba(139,92,246,0.16),rgba(34,211,238,0.1)); border:1px solid var(--stroke-2); }
.article-cta h3{ font-size:1.4rem; margin-bottom:14px; }
.article-cta p{ color:var(--muted); margin-bottom:20px; }

footer{ border-top:1px solid var(--stroke); padding:40px 0; text-align:center; color:var(--muted-2); font-size:0.85rem; }
footer a{ color:var(--muted); } footer a:hover{ color:var(--text); }
