/* ============================================================
   VerCartas — folha de estilo compartilhada do BLOG
   (mesma linguagem visual do index.html; reading-first)
   ============================================================ */
:root{
  --color-void:#0A0612; --color-velvet:#140A1F; --color-ink:#1C1028;
  --color-ember:oklch(68% 0.18 42); --color-sigil:oklch(55% 0.22 305);
  --color-moonstone:oklch(88% 0.08 220); --color-goldleaf:oklch(78% 0.14 85);
  --color-parchment:#E8DFC9; --color-smoke:#9B8FA8; --color-shadow-text:#5A4E6B;
  --font-display:"Cormorant Garamond",Georgia,serif;
  --font-body:"Hanken Grotesk",system-ui,sans-serif;
  --font-mono:"Spline Sans Mono",ui-monospace,monospace;
  --step--1:clamp(0.74rem,0.72rem + 0.08vw,0.78rem);
  --step-0:clamp(0.95rem,0.92rem + 0.13vw,1rem);
  --step-1:clamp(1.02rem,0.97rem + 0.24vw,1.08rem);
  --step-2:clamp(1.2rem,1.1rem + 0.5vw,1.38rem);
  --step-3:clamp(1.45rem,1.25rem + 0.95vw,1.95rem);
  --step-4:clamp(1.95rem,1.55rem + 1.75vw,2.8rem);
  --space-3:0.75rem; --space-4:1rem; --space-5:1.5rem; --space-6:2rem;
  --space-7:3rem; --space-8:4rem; --space-9:6rem;
  --measure:68ch; --radius-md:8px; --radius-lg:14px; --radius-pill:999px;
  --ease-out:cubic-bezier(0.16,1,0.3,1); --dur-fast:240ms; --dur-med:600ms;
  --shadow-card:0 1px 2px rgba(0,0,0,.4),0 12px 40px rgba(0,0,0,.45),inset 0 1px 0 rgba(232,223,201,.04);
  --glow-ember:0 0 60px rgba(255,140,60,.22);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--font-body);font-size:var(--step-0);line-height:1.7;
  color:var(--color-parchment);background:var(--color-void);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;position:relative;min-height:100vh;
}
body::before{
  content:"";position:fixed;inset:0;z-index:-2;
  background:
    radial-gradient(ellipse 90% 60% at 50% -10%,rgba(130,40,200,.10),transparent 60%),
    radial-gradient(ellipse 70% 50% at 85% 110%,rgba(255,140,60,.07),transparent 55%),
    var(--color-void);
}
.grain{position:fixed;inset:0;z-index:5;pointer-events:none;opacity:.04;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
::selection{background:rgba(255,140,60,.25);color:var(--color-parchment)}
:focus-visible{outline:2px solid var(--color-moonstone);outline-offset:3px;border-radius:4px}

.shell{width:100%;max-width:1100px;margin-inline:auto;padding-inline:clamp(1.25rem,5vw,4rem)}
.label{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.18em;
  font-size:var(--step--1);color:var(--color-shadow-text)}

/* ---------- NAV ---------- */
.nav{position:sticky;top:0;z-index:50;background:oklch(8% 0.03 305 / .72);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid oklch(78% 0.14 85 / .12)}
.nav__inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-5);padding-block:var(--space-4)}
.brand{display:inline-flex;align-items:center;gap:.55rem}
.brand__mark{width:28px;height:28px;flex:0 0 auto;filter:drop-shadow(0 0 9px rgba(229,130,69,.4))}
.brand__word{font-family:var(--font-display);font-weight:600;font-size:calc(var(--step-0)*1.28);
  letter-spacing:.015em;line-height:1;color:var(--color-parchment);white-space:nowrap}
.brand__word b{font-weight:600;color:var(--color-goldleaf)}
.nav__links{display:flex;gap:var(--space-6);list-style:none;font-family:var(--font-mono);
  font-size:var(--step--1);letter-spacing:.04em}
.nav__links a{color:var(--color-smoke);transition:color var(--dur-fast) var(--ease-out)}
.nav__links a:hover{color:var(--color-parchment)}
@media (max-width:720px){.nav__links{display:none}}

/* ---------- BOTÃO ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-3);
  font-family:var(--font-body);font-weight:500;font-size:var(--step-0);line-height:1;min-height:44px;
  padding:var(--space-4) var(--space-6);border-radius:var(--radius-md);color:var(--color-parchment);
  background:oklch(12% 0.03 305 / .55);border:1px solid oklch(78% 0.14 85 / .5);
  transition:transform var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out)}
.btn:hover{transform:translateY(-2px);border-color:oklch(78% 0.14 85 / .9);box-shadow:var(--glow-ember)}
.link-underline{display:inline-flex;align-items:center;gap:.4em;color:var(--color-moonstone);
  background-image:linear-gradient(currentColor,currentColor);background-size:0% 1px;background-position:0 100%;
  background-repeat:no-repeat;padding-bottom:2px;transition:background-size var(--dur-med) var(--ease-out)}
.link-underline:hover{background-size:100% 1px}

/* ---------- BLOG ÍNDICE ---------- */
.page-head{padding-block:clamp(3rem,8vw,6rem) var(--space-7);text-align:center}
.page-head h1{font-family:var(--font-display);font-style:italic;font-weight:500;line-height:1.08;
  letter-spacing:-.01em;font-size:var(--step-3);color:var(--color-parchment);max-width:18ch;margin:var(--space-5) auto 0}
.page-head p{color:var(--color-smoke);max-width:54ch;margin:var(--space-5) auto 0}

.posts{display:grid;grid-template-columns:1fr;gap:var(--space-6);padding-bottom:var(--space-9)}
@media (min-width:760px){.posts{grid-template-columns:repeat(2,1fr)}}
.post-card{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-6);
  background:oklch(11% 0.04 305 / .45);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  border:1px solid oklch(78% 0.14 85 / .12);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);
  transition:transform var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out)}
.post-card:hover{transform:translateY(-4px);border-color:oklch(78% 0.14 85 / .3);box-shadow:var(--shadow-card),var(--glow-ember)}
.post-card.is-soon{opacity:.6}
.post-card__meta{font-family:var(--font-mono);font-size:var(--step--1);text-transform:uppercase;
  letter-spacing:.14em;color:var(--color-shadow-text)}
.post-card__title{font-family:var(--font-display);font-style:italic;font-weight:500;line-height:1.12;
  font-size:var(--step-2);color:var(--color-parchment)}
.post-card__excerpt{color:var(--color-smoke)}
.post-card .link-underline{margin-top:auto}

/* ---------- ARTIGO ---------- */
.article{padding-block:clamp(2.5rem,7vw,5rem) var(--space-9)}
.crumbs{font-family:var(--font-mono);font-size:var(--step--1);letter-spacing:.06em;color:var(--color-shadow-text);margin-bottom:var(--space-6)}
.crumbs a{color:var(--color-smoke)}
.crumbs a:hover{color:var(--color-parchment)}
.article__meta{font-family:var(--font-mono);font-size:var(--step--1);text-transform:uppercase;
  letter-spacing:.14em;color:var(--color-shadow-text);margin-bottom:var(--space-4)}
.article h1{font-family:var(--font-display);font-style:italic;font-weight:500;line-height:1.06;
  letter-spacing:-.01em;font-size:var(--step-4);color:var(--color-parchment);max-width:20ch;margin-bottom:var(--space-6)}
.prose{max-width:var(--measure)}
.prose>*{max-width:var(--measure)}
.prose p{margin-bottom:var(--space-5);color:var(--color-parchment)}
.prose h2{font-family:var(--font-display);font-style:italic;font-weight:500;line-height:1.12;
  font-size:var(--step-2);color:var(--color-parchment);margin:var(--space-8) 0 var(--space-4)}
.prose h3{font-family:var(--font-body);font-weight:600;font-size:var(--step-1);color:var(--color-parchment);
  margin:var(--space-6) 0 var(--space-3)}
.prose strong{color:#fff;font-weight:600}
.prose em{font-style:italic}
.prose a{color:var(--color-moonstone);background-image:linear-gradient(currentColor,currentColor);
  background-size:100% 1px;background-position:0 100%;background-repeat:no-repeat;padding-bottom:1px}
.prose ul{list-style:none;margin:0 0 var(--space-5);padding:0}
.prose li{position:relative;padding-left:1.6em;margin-bottom:var(--space-3);color:var(--color-parchment)}
.prose li::before{content:"✧";position:absolute;left:0;color:var(--color-ember)}
.prose blockquote{margin:var(--space-6) 0;padding-left:var(--space-5);border-left:2px solid oklch(78% 0.14 85 / .4);
  font-family:var(--font-display);font-style:italic;font-size:var(--step-1);color:var(--color-smoke)}
.divider{width:100%;height:1px;border:0;margin:var(--space-8) 0;
  background:linear-gradient(90deg,transparent,oklch(78% 0.14 85 / .28),transparent)}

/* caixa de conversão dentro do artigo */
.cta-box{margin:var(--space-8) 0;padding:var(--space-7) var(--space-6);text-align:center;
  background:radial-gradient(ellipse 80% 70% at 50% 50%,oklch(20% 0.08 85 / .12),transparent 70%),oklch(8% 0.03 305 / .5);
  border:1px solid oklch(78% 0.14 85 / .2);border-radius:var(--radius-lg)}
.cta-box h2{margin:0 0 var(--space-4)!important}
.cta-box p{color:var(--color-smoke);max-width:46ch;margin:0 auto var(--space-6)}

/* ---------- FOOTER ---------- */
.footer{padding-block:var(--space-8);border-top:1px solid oklch(78% 0.14 85 / .12)}
.footer__row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-5);align-items:center}
.footer__links{display:flex;flex-wrap:wrap;gap:var(--space-5);list-style:none;font-family:var(--font-mono);
  font-size:var(--step--1);letter-spacing:.06em}
.footer__links a{color:var(--color-smoke)}.footer__links a:hover{color:var(--color-parchment)}
.footer__disclaimer{color:var(--color-shadow-text);font-size:var(--step--1);max-width:72ch;line-height:1.7;margin-top:var(--space-6)}
.footer__disclaimer strong{color:var(--color-smoke);font-weight:500}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}