/* VEG3 — rebuilt on the acquired veg3.ai.
   The palette is the ORIGINAL site's, lifted from the 2024 archived homepage:
   #5bb77e is the green it used 54 times, #5dc283 its hover, #2f374c its ink.
   Keeping them is deliberate. 56 of this domain's inbound anchors read
   literally "VEG3" and another 42 read "veg3.ai", so somebody arriving from
   plantbasednews.org or vegconomist.com is following a BRAND, and the brand
   they are following was green. The subject changes from AI marketing to
   cooking; the identity should not.

   Type: the original was a Bubble app on system sans with no webfont of its
   own. Fraunces (a soft, slightly organic display serif) over Inter keeps the
   modern feel while giving the recipes an editorial voice a SaaS landing page
   never needed.

   Layout identity: PALE-GREEN wash with a wide airy 4-up card grid and a thin
   green hairline over each title — no banded hero. thespicekitchen owns the
   deep-red band, dimsumhaus black+gold dense 3-up, mariaandsingh the teal
   colour-block, chefstable full-viewport white. No overlap. */
:root {
  --s-paper:     #f7faf7;
  --s-surface:   #ffffff;
  --s-surface-2: #edf5ee;
  --s-ink:       #1f2a24;
  --s-ink-soft:  #3c4a42;
  --s-muted:     #6d7d74;
  --s-line:      #dbe7de;
  --s-line-soft: #ecf3ed;
  --s-accent:    #5bb77e;   /* the site's own green */
  --s-accent-ink:#ffffff;
  --s-accent-2:  #2f374c;   /* the original's dark ink, used as the second */
  --s-display: "Fraunces", Georgia, "Times New Roman", serif;
  --s-body:    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --s-radius: 10px;
  --s-card-ratio: 4 / 3;
  --s-wrap: 1180px;
}

/* Header: white, not a colour band — the airy identity starts here. Both the
   background AND the ink are set, because satellite.css pairs .sat-header's
   background with var(--s-accent-ink) and overriding one alone is what caused
   the dark-on-dark bug on mariaandsingh. */
.sat-header {
  background: #ffffff; color: var(--s-ink);
  border-bottom: 1px solid var(--s-line);
}
.sat-header a { color: var(--s-ink); }
.sat-nav a {
  color: var(--s-ink-soft); font-size: .8rem; font-weight: 500;
  letter-spacing: .01em;
}
.sat-nav a:hover { color: var(--s-accent); }
.sat-nav-toggle { color: var(--s-ink); border-color: var(--s-line); }
.sat-logo {
  font-family: var(--s-display); font-weight: 600;
  letter-spacing: .04em; font-size: 1.3rem; color: var(--s-ink);
}
/* The "3" carries the green, the way the original wordmark did. */
.sat-logo em { font-style: normal; color: var(--s-accent); }

.sat-btn {
  background: var(--s-accent); color: #fff; border: none;
  border-radius: 999px; font-weight: 600; font-size: .8rem;
  letter-spacing: .01em;
}
.sat-btn:hover { background: #4aa06c; }

.sat-eyebrow {
  text-transform: uppercase; letter-spacing: .16em; font-size: .66rem;
  color: var(--s-accent); font-weight: 700;
}

h1, h2, h3 { font-family: var(--s-display); font-weight: 600; letter-spacing: -.01em; }
h1 { line-height: 1.12; }

/* Cards: the hairline above the title is this site's tell. */
.sat-card { background: var(--s-surface); border-radius: var(--s-radius); }
.sat-card-img { border-radius: var(--s-radius) var(--s-radius) 0 0; }
.sat-card-title {
  font-family: var(--s-display); font-weight: 600; padding-top: 10px;
  border-top: 2px solid var(--s-accent);
}
.sat-card-title a:hover { color: var(--s-accent); }
.sat-card-meta { color: var(--s-muted); font-size: .74rem; }

/* Hero: a soft green wash rather than a solid band. */
.sat-hero {
  background: linear-gradient(180deg, var(--s-surface-2) 0%, var(--s-paper) 100%);
  border-bottom: 1px solid var(--s-line);
}
.sat-hero-brand { font-family: var(--s-display); }
.sat-lede { color: var(--s-ink-soft); }

.sat-section-head { border-bottom: 1px solid var(--s-line); }
.sat-crumbs a { color: var(--s-muted); }
.sat-crumbs a:hover { color: var(--s-accent); }

/* Recipe body */
.sat-ingredients li::marker { color: var(--s-accent); }
.sat-steps li::before { background: var(--s-accent); color: #fff; }
.sat-note {
  background: var(--s-surface-2); border-left: 3px solid var(--s-accent);
  border-radius: 0 var(--s-radius) var(--s-radius) 0;
}
.sat-fact { background: var(--s-surface-2); border-radius: var(--s-radius); }
.sat-amount { color: var(--s-accent-2); font-weight: 600; }
.sat-prose a { color: var(--s-accent-2); text-decoration-color: var(--s-accent); }

.sat-footer {
  background: var(--s-accent-2); color: #cfd6e0;
  border-top: 4px solid var(--s-accent);
}
.sat-footer a { color: #eef2f6; }
.sat-footer a:hover { color: var(--s-accent); }
.sat-footer h2 {
  color: #fff; font-size: .72rem; text-transform: uppercase;
  letter-spacing: .16em; font-family: var(--s-body); font-weight: 700;
}
.sat-footer-base { border-top: 1px solid rgba(255,255,255,.12); color: #9aa5b4; }
