/* ════════════════════════════════════════════════
   lefune blog · tokens + shared components
   Editorial Sereno · mobile-first
   ════════════════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --text:#2c302e;--text-m:#5a6360;--text-l:#697067;
  /* texto sobre fondo oscuro · consumidos por money.css, obit.css y chrome.css */
  --on-dark:#fdfbf7;--on-dark-m:rgba(253,251,247,.72);--on-dark-l:rgba(253,251,247,.5);--on-dark-rule:rgba(253,251,247,.22);
  --on-sage:#fff;--on-sage-m:rgba(255,255,255,.86);--on-sage-rule:rgba(255,255,255,.3);
  --cream:#fdfbf7;--cream2:#f6f3ec;--white:#fffefb;
  --teal:#4b5d4f;--teal-d:#3a4a3e;--teal-l:#eef2ef;--teal-m:#8f9e8a;
  --accent:#c2a684;--accent-d:#a98e6b;
  --dark:#1a1f1b;--dark2:#222a24;
  --line:rgba(75,93,79,.14);--line-2:rgba(75,93,79,.09);
  --serif:'Newsreader',Georgia,serif;
  --sans:'Plus Jakarta Sans',-apple-system,system-ui,sans-serif;
  --sh:0 1px 2px rgba(26,31,27,.04),0 8px 24px rgba(26,31,27,.05);
  --sh-lg:0 14px 50px rgba(26,31,27,.10);
  --r:10px;--r-lg:16px;--r-xl:22px;
}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--sans);background:var(--cream);color:var(--text);
  line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
svg.lucide{display:block;stroke-width:1.6}

/* ── layout ── */
.wrap{width:100%;max-width:1180px;margin:0 auto;padding:0 20px}
.narrow{max-width:660px;margin:0 auto}

/* ── nav ── */
.nav{position:sticky;top:0;z-index:50;background:rgba(253,251,247,.86);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line)}
.nav-in{display:flex;align-items:center;justify-content:space-between;
  height:60px;max-width:1180px;margin:0 auto;padding:0 20px}
.logo{font-size:21px;font-weight:700;letter-spacing:-.5px;color:var(--text)}
.logo span{color:var(--teal)}
.nav-links{display:none;gap:30px}
.nav-links a{font-size:12px;font-weight:600;letter-spacing:.6px;text-transform:uppercase;
  color:var(--text);opacity:.6;transition:opacity .2s}
.nav-links a:hover,.nav-links a.active{opacity:1;color:var(--teal)}
.nav-cta{display:inline-flex;align-items:center;gap:7px;background:var(--teal);color:var(--cream);
  font-size:12.5px;font-weight:600;padding:9px 15px;border-radius:8px;border:0;cursor:pointer;
  font-family:inherit;transition:background .2s;white-space:nowrap;line-height:1}
.nav-cta:hover{background:var(--teal-d)}
.nav-cta svg{width:15px;height:15px}
.nav-menu{display:flex;width:38px;height:38px;align-items:center;justify-content:center;
  border:1px solid var(--line);border-radius:9px;color:var(--text-m);background:none;cursor:pointer;margin-left:10px}
.nav-menu svg{width:18px;height:18px}
@media(min-width:820px){
  .nav-in{height:70px}
  .nav-links{display:flex}
  .nav-menu{display:none}
  .nav-cta{font-size:13px;padding:11px 18px}
}

/* ── eyebrow / headings ── */
.eyebrow{display:inline-flex;align-items:center;gap:11px;
  font-size:11px;font-weight:600;letter-spacing:2.2px;text-transform:uppercase;color:var(--teal);}
.eyebrow::before{content:'';width:24px;height:1px;background:var(--accent)}
.serif{font-family:var(--serif)}

/* ── category chip ── */
.cat{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;
  letter-spacing:.8px;text-transform:uppercase;color:var(--teal);}
.cat-pill{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;
  letter-spacing:.4px;padding:6px 13px;border-radius:50px;border:1px solid var(--line);
  color:var(--text-m);background:var(--white);cursor:pointer;transition:all .2s;white-space:nowrap}
.cat-pill:hover,.cat-pill.on{background:var(--teal);color:var(--cream);border-color:var(--teal)}
.cat-pill .dot{width:6px;height:6px;border-radius:50%;background:var(--accent)}

/* ── buttons ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:inherit;font-size:14px;font-weight:600;padding:13px 22px;border-radius:9px;
  border:0;cursor:pointer;transition:all .2s;white-space:nowrap}
.btn svg{width:16px;height:16px}
.btn-primary{background:var(--teal);color:var(--cream)}
.btn-primary:hover{background:var(--teal-d)}
.btn-ghost{background:none;color:var(--teal);border:1px solid var(--line)}
.btn-ghost:hover{border-color:var(--teal)}
.btn-white{background:var(--cream);color:var(--teal)}
.btn-white:hover{background:#fff}

/* ── image placeholder ── */
.ph{position:relative;background:
  repeating-linear-gradient(135deg,var(--cream2),var(--cream2) 11px,#efeae0 11px,#efeae0 22px);
  display:flex;align-items:center;justify-content:center;overflow:hidden}
.ph span{font-family:'SF Mono',ui-monospace,Menlo,monospace;font-size:11px;letter-spacing:.4px;
  color:var(--text-l);background:rgba(253,251,247,.78);padding:5px 11px;border-radius:50px;
  display:inline-flex;align-items:center;gap:6px}
.ph span svg{width:13px;height:13px}

/* ── meta row ── */
.meta{display:flex;align-items:center;gap:14px;font-size:12.5px;color:var(--text-l);flex-wrap:wrap}
.meta .m{display:inline-flex;align-items:center;gap:5px}
.meta svg{width:13px;height:13px;color:var(--accent)}

/* ── CTA band ── */
.cta-band{background:var(--dark);color:var(--cream);border-radius:var(--r-xl);
  padding:36px 26px;text-align:center;position:relative;overflow:hidden}
.cta-band .eyebrow{color:var(--teal-m)}
.cta-band h3{font-family:var(--serif);font-weight:500;font-size:25px;line-height:1.2;
  letter-spacing:-.5px;margin:14px 0 10px}
.cta-band p{font-size:14px;color:var(--on-dark-m);max-width:380px;margin:0 auto 22px}

/* ── footer ── */
.foot{background:var(--dark);color:var(--on-dark-m);margin-top:0;padding:48px 0 30px}
.foot-in{max-width:1180px;margin:0 auto;padding:0 20px}
.foot-top{display:flex;flex-direction:column;gap:26px;padding-bottom:30px;border-bottom:1px solid rgba(253,251,247,.1)}
.foot .logo{color:var(--cream)}.foot .logo span{color:var(--accent)}
.foot-tag{font-size:13px;line-height:1.6;max-width:300px;margin-top:12px}
.foot-cols{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.foot-col h5{font-size:11px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;
  color:var(--on-dark);margin-bottom:13px}
.foot-col a{display:block;font-size:13px;padding:5px 0;transition:color .2s}
.foot-col a:hover{color:var(--cream)}
.foot-bot{padding-top:24px;font-size:12px;color:var(--on-dark-l);
  display:flex;flex-wrap:wrap;gap:6px 16px;justify-content:space-between}
@media(min-width:820px){
  .foot-top{flex-direction:row;justify-content:space-between}
  .foot-cols{grid-template-columns:repeat(3,auto);gap:60px}
}

/* ── reveal (only when active, respects reduced motion) ── */
@media(prefers-reduced-motion:no-preference){
  .rise{opacity:0;transform:translateY(14px);animation:rise .7s cubic-bezier(.2,.7,.2,1) forwards}
  @keyframes rise{to{opacity:1;transform:none}}
}