/* 4Balance — site institucional (produção) */
:root {
  --b4b-cream: #ece5d6;
  --b4b-cream-2: #f4efe4;
  --b4b-green: #22301f;
  --b4b-green-2: #2e4029;
  --b4b-ink: #171b15;
  --b4b-muted: #6a705f;
  --b4b-line: #d8cfba;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  background: var(--b4b-cream-2);
  color: var(--b4b-ink);
}
.b4b { max-width: 1080px; margin: 0 auto; }

.b4b-topbar { display: flex; align-items: center; gap: 12px; padding: 14px 22px; background: var(--b4b-cream); border-bottom: 1px solid var(--b4b-line); flex-wrap: wrap; position: sticky; top: 0; z-index: 10; }
.b4b-logo { height: 26px; width: auto; display: block; }
.b4b-logo-footer { height: 22px; }
.b4b-logo-hero { height: 30px; width: auto; display: block; margin-bottom: 22px; }
.b4b-nav { margin-left: auto; display: flex; gap: 16px; flex-wrap: wrap; }
.b4b-nav a { color: var(--b4b-ink); text-decoration: none; font-size: 14px; font-weight: 600; opacity: .85; }
.b4b-nav a:hover { opacity: 1; text-decoration: underline; }

.b4b-hero { background: var(--b4b-green); color: #f3efe3; padding: 44px 26px 40px; }
.b4b-kicker { font-size: 12.5px; letter-spacing: .18em; text-transform: uppercase; opacity: .75; margin: 0 0 12px; }
.b4b-hero h1 { font-family: Georgia, 'Times New Roman', serif; font-weight: 600; font-size: 40px; line-height: 1.12; margin: 0 0 14px; max-width: 640px; }
.b4b-hero p.sub { font-size: 16.5px; line-height: 1.5; opacity: .88; margin: 0 0 24px; max-width: 520px; }
.b4b-ctas { display: flex; gap: 12px; flex-wrap: wrap; }
.b4b-btn { display: inline-block; padding: 12px 20px; border-radius: 999px; font-size: 15px; font-weight: 700; text-decoration: none; }
.b4b-btn-primary { background: var(--b4b-cream); color: var(--b4b-green); }
.b4b-btn-ghost { border: 1.5px solid rgba(243,239,227,.55); color: #f3efe3; }
.b4b-hero-img { margin: 28px auto 0; max-width: 640px; }
.b4b-hero-img img { width: 100%; border-radius: 14px; display: block; }

.b4b-section { padding: 34px 26px; }
.b4b-section h2 { font-family: Georgia, 'Times New Roman', serif; font-size: 27px; margin: 0 0 6px; }
.b4b-section p.lead { color: var(--b4b-muted); font-size: 15px; margin: 0 0 20px; max-width: 560px; }

.b4b-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; }
.b4b-card { background: #fff; border: 1px solid var(--b4b-line); border-radius: 14px; overflow: hidden; display: flex; flex-direction: column; }
.b4b-card img { width: 100%; aspect-ratio: 4/5; object-fit: cover; display: block; }
.b4b-card .body { padding: 13px 14px 15px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.b4b-card .name { font-weight: 700; font-size: 15.5px; }
.b4b-card .desc { font-size: 13.5px; color: var(--b4b-muted); line-height: 1.45; flex: 1; }
.b4b-card .buy { font-size: 13.5px; font-weight: 700; color: var(--b4b-green); text-decoration: none; }
.b4b-card .buy:hover { text-decoration: underline; }
.b4b-card .buy.off { color: var(--b4b-muted); font-weight: 600; }

.b4b-mp { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; }
.b4b-mp a.card { display: block; background: var(--b4b-cream); border: 1px solid var(--b4b-line); border-radius: 14px; padding: 18px; text-decoration: none; color: var(--b4b-ink); }
.b4b-mp a.card:hover { border-color: var(--b4b-green); }
.b4b-mp .mp-name { font-weight: 800; font-size: 16px; margin-bottom: 4px; }
.b4b-mp .mp-desc { font-size: 13.5px; color: var(--b4b-muted); }
.b4b-mp .mp-go { font-size: 13px; font-weight: 700; margin-top: 10px; color: var(--b4b-green); }

.b4b-insta { background: var(--b4b-green-2); color: #f3efe3; display: flex; gap: 22px; align-items: center; padding: 30px 26px; flex-wrap: wrap; }
.b4b-insta img { width: 150px; border-radius: 12px; display: block; }
.b4b-insta h2 { font-family: Georgia, 'Times New Roman', serif; font-size: 24px; margin: 0 0 6px; }
.b4b-insta p { margin: 0 0 14px; font-size: 14.5px; opacity: .88; max-width: 420px; }

.b4b-footer { padding: 22px 26px 26px; background: var(--b4b-cream); border-top: 1px solid var(--b4b-line); display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.b4b-footer .tag { font-family: Georgia, 'Times New Roman', serif; font-size: 15px; }
.b4b-footer .mini { font-size: 12px; color: var(--b4b-muted); margin-left: auto; max-width: 340px; }

@media (max-width: 520px) {
  .b4b-hero h1 { font-size: 30px; }
  .b4b-section h2 { font-size: 23px; }
  .b4b-nav { width: 100%; margin-left: 0; }
  .b4b-footer .mini { margin-left: 0; }
}
