/* juicercafe — a hand-coded cafe/coffeeshop theme for juicer.
 *
 * Conventions follow juicerblog and juicerchurch: CSS variables for
 * tokens, [data-theme="dark"] overrides, semantic .juicercafe-* class
 * names. No utility framework.
 *
 * Default palette is espresso + cream + caramel — third-wave coffee
 * shop, warm wood and oat milk, intentional and quiet rather than
 * bright corporate. Body type stays serif for long sits; menu prices
 * and hours use a single-weight monospace so columns line up like a
 * coffee bar's chalkboard. */

/* ============================================================
   Tokens
   ============================================================ */
:root {
  /* Brand */
  --brand:        #6f4e37;          /* espresso brown */
  --brand-strong: #4a2c1f;          /* dark roast */
  --brand-soft:   #f0e3d4;          /* latte foam */
  --accent:       #b08968;          /* caramel */
  --leaf:         #8a9a5b;          /* matcha (open / fresh-roast badges) */

  /* Surfaces */
  --bg:        #faf6ef;             /* oat milk cream */
  --surface:   #ffffff;             /* card background */
  --ink:       #2b1d12;             /* rich espresso (body text) */
  --ink-soft:  #5b4434;             /* secondary text */
  --ink-faint: #8a7763;             /* meta text */
  --rule:      #e8dccb;             /* hairlines */
  --rule-soft: #f3ebdc;             /* subtler hairlines */

  /* Code */
  --code-bg:     #f3ebdc;
  --code-border: #e8dccb;
  --code-ink:    #2b1d12;

  /* Type */
  --font-sans:   -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-serif:  "Iowan Old Style", "Source Serif Pro", "Charter", Georgia, "Times New Roman", serif;
  --font-mono:   "SF Mono", "Menlo", "Consolas", "Roboto Mono", monospace;

  /* Sizing */
  --measure:     38rem;
  --gutter:      1.5rem;
  --gutter-wide: 3rem;

  /* Radii + transitions */
  --radius:     0.375rem;
  --radius-lg:  0.625rem;
  --transition: 0.15s ease;
}

[data-theme="dark"] {
  --brand:        #c8a484;          /* lighter espresso for dark bg */
  --brand-strong: #e6c9a8;
  --brand-soft:   rgba(200, 164, 132, 0.18);
  --accent:       #d4a373;          /* warm caramel, lifted */
  --leaf:         #a3b380;

  --bg:        #1c1410;             /* deep roasted */
  --surface:   #2a1f18;
  --ink:       #f0e6d8;
  --ink-soft:  #c8b8a0;
  --ink-faint: #8a7e6a;
  --rule:      #3d2f24;
  --rule-soft: #2a1f18;

  --code-bg:     #2a1f18;
  --code-border: #3d2f24;
  --code-ink:    #f0e6d8;
}

/* ============================================================
   Reset + base
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font-serif);
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--ink);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

a {
  color: var(--accent);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
  transition: color var(--transition);
}
a:hover { color: var(--brand-strong); }

img, video, svg { max-width: 100%; height: auto; display: block; }

hr {
  border: 0;
  border-top: 1px solid var(--rule);
  margin: 2rem 0;
}

code, pre, kbd, samp {
  font-family: var(--font-mono);
  font-size: 0.9375em;
}
pre {
  background: var(--code-bg);
  border: 1px solid var(--code-border);
  border-radius: var(--radius-lg);
  padding: 1rem 1.125rem;
  overflow-x: auto;
  line-height: 1.55;
}

/* ============================================================
   Page shell — full-bleed sections inside, centered measure for prose
   ============================================================ */
.juicercafe-page {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
.juicercafe-main {
  flex: 1;
}

/* ============================================================
   Topbar
   ============================================================ */
.juicercafe-topbar {
  background: var(--surface);
  border-bottom: 1px solid var(--rule);
}
.juicercafe-topbar-inner {
  max-width: 72rem;
  margin: 0 auto;
  padding: 1.25rem var(--gutter);
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 1rem;
}
.juicercafe-brand {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--font-serif);
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--brand-strong);
  text-decoration: none;
}
.juicercafe-brand:hover { color: var(--brand); }
.juicercafe-brand-logo {
  width: 1.75rem;
  height: 1.75rem;
}
.juicercafe-brand-name { display: inline; }
.juicercafe-tagline {
  color: var(--ink-faint);
  font-style: italic;
  font-size: 0.9375rem;
}
.juicercafe-nav {
  margin-left: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 1.25rem;
  font-family: var(--font-sans);
  font-size: 0.9375rem;
}
.juicercafe-nav a {
  color: var(--ink-soft);
  text-decoration: none;
  padding: 0.25rem 0;
  border-bottom: 2px solid transparent;
  transition: color var(--transition), border-color var(--transition);
}
.juicercafe-nav a:hover {
  color: var(--brand-strong);
  border-bottom-color: var(--accent);
}

/* ============================================================
   Footer
   ============================================================ */
.juicercafe-footer {
  background: var(--brand-strong);
  color: var(--brand-soft);
  margin-top: 4rem;
  padding: 2.5rem var(--gutter) 1.5rem;
}
.juicercafe-footer-inner {
  max-width: 72rem;
  margin: 0 auto;
  display: grid;
  gap: 2rem;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
}
.juicercafe-footer h3 {
  font-family: var(--font-sans);
  font-size: 0.8125rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--accent);
  margin: 0 0 0.75rem;
}
.juicercafe-footer p {
  margin: 0.25rem 0;
  font-size: 0.9375rem;
  line-height: 1.55;
}
.juicercafe-footer a {
  color: var(--brand-soft);
  text-decoration: none;
}
.juicercafe-footer a:hover {
  color: #fff;
  text-decoration: underline;
}
.juicercafe-footer-attribution {
  max-width: 72rem;
  margin: 2rem auto 0;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(255,255,255,0.12);
  font-size: 0.8125rem;
  color: var(--brand-soft);
  opacity: 0.75;
  text-align: center;
}
.juicercafe-footer-attribution a {
  color: var(--brand-soft);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ============================================================
   Hero — visitor-first home banner
   ============================================================ */
.juicercafe-hero {
  background:
    linear-gradient(180deg, rgba(111,78,55,0.05), rgba(111,78,55,0)),
    var(--brand-soft);
  border-bottom: 1px solid var(--rule);
}
.juicercafe-hero-inner {
  max-width: 50rem;
  margin: 0 auto;
  padding: 4.5rem var(--gutter) 4rem;
  text-align: center;
}
.juicercafe-hero-title {
  font-family: var(--font-serif);
  font-size: clamp(2.25rem, 5vw, 3.75rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.1;
  margin: 0 0 1rem;
  color: var(--brand-strong);
}
.juicercafe-hero-tagline {
  font-style: italic;
  font-size: 1.25rem;
  color: var(--ink-soft);
  margin: 0 0 1.5rem;
}
.juicercafe-hero-intro {
  margin: 0 auto 2rem;
  max-width: var(--measure);
  color: var(--ink-soft);
}
.juicercafe-hero-intro p { margin: 0.5rem 0; }
.juicercafe-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: center;
}
.juicercafe-hero-cta {
  display: inline-block;
  background: var(--brand-strong);
  color: var(--brand-soft);
  padding: 0.875rem 1.75rem;
  border-radius: var(--radius);
  font-family: var(--font-sans);
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  transition: background var(--transition), transform var(--transition);
}
.juicercafe-hero-cta:hover {
  background: var(--brand);
  color: #fff;
  transform: translateY(-1px);
}
.juicercafe-hero-cta--secondary {
  background: transparent;
  color: var(--brand-strong);
  border: 1.5px solid var(--brand-strong);
}
.juicercafe-hero-cta--secondary:hover {
  background: var(--brand-strong);
  color: var(--brand-soft);
}

/* ============================================================
   Hours widget — the cafe equivalent of "service times"
   Single-weight monospace so day + range columns line up.
   ============================================================ */
.juicercafe-hours {
  max-width: 36rem;
  margin: -2rem auto 3rem;
  background: var(--surface);
  border: 1px solid var(--rule);
  border-radius: var(--radius-lg);
  padding: 1.5rem 1.75rem;
  box-shadow: 0 4px 16px rgba(75,44,31,0.06);
}
.juicercafe-hours-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--rule-soft);
}
.juicercafe-hours-title {
  font-family: var(--font-sans);
  font-size: 0.8125rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ink-faint);
  margin: 0;
}
.juicercafe-hours-badge {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 0.25rem 0.625rem;
  border-radius: 999px;
}
.juicercafe-hours-badge.is-open {
  background: rgba(138,154,91,0.15);
  color: var(--leaf);
}
.juicercafe-hours-badge.is-closed {
  background: var(--rule-soft);
  color: var(--ink-faint);
}
.juicercafe-hours-list {
  display: grid;
  gap: 0.375rem;
  font-family: var(--font-mono);
  font-size: 0.9375rem;
}
.juicercafe-hours-row {
  display: grid;
  grid-template-columns: 6rem 1fr auto;
  align-items: baseline;
  gap: 0.75rem;
}
.juicercafe-hours-day {
  color: var(--ink-soft);
  font-weight: 600;
}
.juicercafe-hours-range {
  color: var(--ink);
}
.juicercafe-hours-note {
  color: var(--ink-faint);
  font-size: 0.8125rem;
  font-family: var(--font-sans);
}
.juicercafe-hours-row.is-closed .juicercafe-hours-range {
  color: var(--ink-faint);
  font-style: italic;
}

/* ============================================================
   Visit card — used on home + /visit/
   ============================================================ */
.juicercafe-visit-card {
  max-width: 36rem;
  margin: 0 auto 3rem;
  background: var(--surface);
  border: 1px solid var(--rule);
  border-radius: var(--radius-lg);
  padding: 1.5rem 1.75rem;
}
.juicercafe-visit-title {
  font-family: var(--font-sans);
  font-size: 0.8125rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ink-faint);
  margin: 0 0 0.75rem;
}
.juicercafe-visit-card p {
  margin: 0.25rem 0;
  font-family: var(--font-serif);
  color: var(--ink);
}
.juicercafe-visit-card a {
  color: var(--accent);
  text-decoration: none;
}
.juicercafe-visit-card a:hover { color: var(--brand-strong); text-decoration: underline; }

/* ============================================================
   Generic page wrap — file.html, folder.html
   ============================================================ */
.juicercafe-page-wrap {
  max-width: 48rem;
  margin: 0 auto;
  padding: 3rem var(--gutter);
}
.juicercafe-page-title {
  font-family: var(--font-serif);
  font-size: clamp(2rem, 4vw, 2.75rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  margin: 0 0 1.5rem;
  color: var(--brand-strong);
}
.juicercafe-content {
  color: var(--ink);
}
.juicercafe-content h2 {
  font-family: var(--font-serif);
  font-size: 1.625rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 2.25rem 0 0.75rem;
  color: var(--brand-strong);
}
.juicercafe-content h3 {
  font-family: var(--font-serif);
  font-size: 1.25rem;
  font-weight: 700;
  margin: 1.75rem 0 0.5rem;
  color: var(--ink);
}
.juicercafe-content p { margin: 0.75rem 0; }
.juicercafe-content ul, .juicercafe-content ol {
  padding-left: 1.5rem;
  margin: 0.75rem 0;
}
.juicercafe-content li { margin: 0.25rem 0; }
.juicercafe-content blockquote {
  margin: 1.25rem 0;
  padding: 0.5rem 1.25rem;
  border-left: 3px solid var(--accent);
  background: var(--brand-soft);
  color: var(--ink-soft);
  font-style: italic;
}

/* ============================================================
   Section list — folder.html
   ============================================================ */
.juicercafe-postlist {
  list-style: none;
  padding: 0;
  margin: 1.5rem 0 0;
  display: grid;
  gap: 1.5rem;
}
.juicercafe-postlist > li {
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--rule-soft);
}
.juicercafe-postlist > li:last-child { border-bottom: none; }
.juicercafe-postlist-title {
  font-family: var(--font-serif);
  font-size: 1.375rem;
  font-weight: 700;
  margin: 0 0 0.375rem;
}
.juicercafe-postlist-title a {
  color: var(--brand-strong);
  text-decoration: none;
}
.juicercafe-postlist-title a:hover { color: var(--accent); text-decoration: underline; }
.juicercafe-postlist-meta {
  font-family: var(--font-mono);
  font-size: 0.8125rem;
  color: var(--ink-faint);
  margin: 0 0 0.5rem;
}
.juicercafe-postlist-summary {
  margin: 0.5rem 0 0;
  color: var(--ink-soft);
}

/* ============================================================
   Menu — chalkboard-style price list with mono prices and
   leader dots between name and price so columns align
   regardless of name length.
   ============================================================ */
.juicercafe-menu-page { max-width: 52rem; }
.juicercafe-menu-intro { margin-bottom: 2rem; color: var(--ink-soft); }

.juicercafe-menu-toc {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.25rem;
  padding: 0.875rem 1.125rem;
  margin: 0 0 2.5rem;
  background: var(--brand-soft);
  border-radius: var(--radius);
  font-family: var(--font-sans);
  font-size: 0.9375rem;
}
.juicercafe-menu-toc a {
  color: var(--brand-strong);
  text-decoration: none;
  font-weight: 600;
}
.juicercafe-menu-toc a:hover { color: var(--accent); }

.juicercafe-menu-section {
  margin: 2.5rem 0 3rem;
  padding-top: 1.25rem;
  border-top: 2px solid var(--brand-strong);
}
.juicercafe-menu-section-head { margin-bottom: 1.5rem; }
.juicercafe-menu-section-title {
  font-family: var(--font-serif);
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  margin: 0 0 0.375rem;
}
.juicercafe-menu-section-title a {
  color: var(--brand-strong);
  text-decoration: none;
}
.juicercafe-menu-section-title a:hover { color: var(--accent); }
.juicercafe-menu-section-summary {
  margin: 0;
  color: var(--ink-faint);
  font-style: italic;
  font-size: 1rem;
}
.juicercafe-menu-section-summary--lg {
  font-size: 1.125rem;
  margin: -0.5rem 0 1.5rem;
}
.juicercafe-menu-section-back {
  font-family: var(--font-sans);
  font-size: 0.9375rem;
  color: var(--ink-faint);
  margin: 0 0 0.5rem;
}
.juicercafe-menu-section-back a {
  color: var(--accent);
  text-decoration: none;
}
.juicercafe-menu-section-back a:hover { color: var(--brand-strong); text-decoration: underline; }

.juicercafe-menu-items {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 1rem;
}
.juicercafe-menu-item { padding: 0.5rem 0; }
.juicercafe-menu-item-line {
  display: flex;
  align-items: baseline;
  gap: 0.625rem;
  font-family: var(--font-serif);
  font-size: 1.1875rem;
}
.juicercafe-menu-item-name {
  font-weight: 600;
  color: var(--ink);
  white-space: nowrap;
}
.juicercafe-menu-item-leader {
  flex: 1;
  border-bottom: 1.5px dotted var(--rule);
  height: 0.625em;
}
.juicercafe-menu-item-price {
  font-family: var(--font-mono);
  font-size: 1rem;
  font-weight: 600;
  color: var(--brand-strong);
  white-space: nowrap;
}
.juicercafe-menu-item-desc {
  margin: 0.25rem 0 0;
  color: var(--ink-soft);
  font-size: 0.9375rem;
  line-height: 1.5;
}
.juicercafe-menu-item-tags {
  list-style: none;
  padding: 0;
  margin: 0.5rem 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
}
.juicercafe-menu-item-tags li {
  font-family: var(--font-sans);
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  background: var(--brand-soft);
  color: var(--brand-strong);
  padding: 0.125rem 0.5rem;
  border-radius: 999px;
}

/* ============================================================
   Events — date-chip cards on lists, full date chip on detail
   ============================================================ */
.juicercafe-event {
  max-width: 52rem;
  margin: 0 auto;
  padding: 3rem var(--gutter);
}
.juicercafe-event-header {
  display: grid;
  grid-template-columns: 8rem 1fr;
  gap: 1.5rem;
  align-items: start;
  margin-bottom: 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--rule);
}
.juicercafe-event-datechip {
  background: var(--brand-strong);
  color: var(--brand-soft);
  border-radius: var(--radius-lg);
  padding: 1rem 0.75rem;
  text-align: center;
}
.juicercafe-event-datechip-month {
  font-family: var(--font-sans);
  font-size: 0.8125rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0 0 0.25rem;
  color: var(--accent);
}
.juicercafe-event-datechip-day {
  font-family: var(--font-mono);
  font-size: 1rem;
  font-weight: 600;
  margin: 0;
}
.juicercafe-event-headline { min-width: 0; }
.juicercafe-event-title {
  font-family: var(--font-serif);
  font-size: clamp(1.875rem, 3.5vw, 2.5rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.15;
  margin: 0 0 1rem;
  color: var(--brand-strong);
}
.juicercafe-event-facts {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 0.375rem;
  font-family: var(--font-sans);
  font-size: 0.9375rem;
  color: var(--ink-soft);
}
.juicercafe-event-fact-label {
  display: inline-block;
  min-width: 4rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.75rem;
  color: var(--ink-faint);
}
.juicercafe-event-recurring-badge {
  background: var(--leaf);
  color: #fff;
  padding: 0.125rem 0.5rem;
  border-radius: 999px;
  min-width: 0;
}
.juicercafe-event-body { margin-bottom: 2rem; }
.juicercafe-event-back {
  font-family: var(--font-sans);
  font-size: 0.9375rem;
  margin: 2.5rem 0 0;
}
.juicercafe-event-back a {
  color: var(--accent);
  text-decoration: none;
}
.juicercafe-event-back a:hover { color: var(--brand-strong); text-decoration: underline; }

.juicercafe-event-group {
  max-width: 52rem;
  margin: 2rem auto;
  padding: 0 var(--gutter);
}
.juicercafe-event-group-head {
  font-family: var(--font-sans);
  font-size: 0.8125rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ink-faint);
  margin: 0 0 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--rule);
}
.juicercafe-event-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 1rem;
}
.juicercafe-event-card {
  display: grid;
  grid-template-columns: 6rem 1fr;
  gap: 1rem;
  padding: 1rem;
  background: var(--surface);
  border: 1px solid var(--rule);
  border-radius: var(--radius-lg);
  transition: border-color var(--transition), transform var(--transition);
}
.juicercafe-event-card:hover {
  border-color: var(--accent);
  transform: translateY(-1px);
}
.juicercafe-event-card.is-recurring {
  border-left: 3px solid var(--leaf);
}
.juicercafe-event-card-datechip {
  background: var(--brand-soft);
  color: var(--brand-strong);
  border-radius: var(--radius);
  padding: 0.625rem 0.5rem;
  text-align: center;
}
.juicercafe-event-card-month {
  font-family: var(--font-sans);
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0 0 0.125rem;
  color: var(--ink-faint);
}
.juicercafe-event-card-day {
  font-family: var(--font-mono);
  font-size: 0.8125rem;
  font-weight: 600;
  margin: 0;
}
.juicercafe-event-card-meta { min-width: 0; }
.juicercafe-event-card-title {
  font-family: var(--font-serif);
  font-size: 1.25rem;
  font-weight: 700;
  margin: 0 0 0.25rem;
}
.juicercafe-event-card-title a {
  color: var(--brand-strong);
  text-decoration: none;
}
.juicercafe-event-card-title a:hover { color: var(--accent); }
.juicercafe-event-card-loc {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 0.8125rem;
  color: var(--ink-faint);
}
.juicercafe-event-card-summary {
  margin: 0.375rem 0 0;
  color: var(--ink-soft);
  font-size: 0.9375rem;
}
.juicercafe-event-card--past {
  opacity: 0.7;
}
.juicercafe-empty {
  font-family: var(--font-serif);
  font-style: italic;
  color: var(--ink-faint);
  text-align: center;
  padding: 1.5rem;
}

/* ============================================================
   Team / staff — author-list and author-page
   ============================================================ */
.juicercafe-staff-intro {
  font-style: italic;
  color: var(--ink-soft);
  margin: -1rem 0 2rem;
}
.juicercafe-staff-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 1.5rem;
}
.juicercafe-staff-card {
  display: grid;
  grid-template-columns: 5rem 1fr;
  gap: 1.25rem;
  align-items: start;
  background: var(--surface);
  border: 1px solid var(--rule);
  border-radius: var(--radius-lg);
  padding: 1.25rem;
}
.juicercafe-staff-avatar {
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  object-fit: cover;
}
.juicercafe-staff-avatar--lg {
  width: 8rem;
  height: 8rem;
}
.juicercafe-staff-meta { min-width: 0; }
.juicercafe-staff-name {
  font-family: var(--font-serif);
  font-size: 1.375rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 0 0 0.125rem;
  color: var(--brand-strong);
}
.juicercafe-staff-name--lg {
  font-size: 1.875rem;
  margin: 0 0 0.25rem;
}
.juicercafe-staff-name a {
  color: var(--brand-strong);
  text-decoration: none;
}
.juicercafe-staff-name a:hover { color: var(--accent); }
.juicercafe-staff-role {
  font-family: var(--font-sans);
  font-size: 0.875rem;
  color: var(--accent);
  margin: 0 0 0.625rem;
  font-weight: 600;
}
.juicercafe-staff-role--lg {
  font-size: 1rem;
}
.juicercafe-staff-bio {
  color: var(--ink-soft);
  font-size: 0.9375rem;
  margin: 0;
  line-height: 1.55;
}
.juicercafe-staff-bio--lg {
  font-size: 1rem;
  margin: 0.75rem 0 1rem;
  line-height: 1.6;
}
.juicercafe-staff-links {
  list-style: none;
  padding: 0;
  margin: 0.75rem 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.875rem;
  font-family: var(--font-sans);
  font-size: 0.875rem;
}
.juicercafe-staff-links a {
  color: var(--accent);
  text-decoration: none;
}
.juicercafe-staff-links a:hover { color: var(--brand-strong); text-decoration: underline; }
.juicercafe-staff-page-header {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 2rem;
  align-items: start;
  margin-bottom: 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--rule);
}
.juicercafe-staff-archive-head {
  font-family: var(--font-serif);
  font-size: 1.5rem;
  font-weight: 700;
  margin: 2rem 0 1rem;
  color: var(--brand-strong);
}
.juicercafe-staff-back {
  margin: 2.5rem 0 0;
  font-family: var(--font-sans);
  font-size: 0.9375rem;
}
.juicercafe-staff-back a {
  color: var(--accent);
  text-decoration: none;
}
.juicercafe-staff-back a:hover { color: var(--brand-strong); text-decoration: underline; }

/* ============================================================
   Home strips — shared scaffolding for every "what's happening"
   strip on the homepage (menu / events / photos / working).
   ============================================================ */
.juicercafe-home-strip {
  max-width: 64rem;
  margin: 2.5rem auto 0;
  padding: 0 var(--gutter);
}

.juicercafe-home-strip-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--rule);
}

.juicercafe-home-strip-title {
  font-family: var(--font-serif);
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--brand-strong);
  margin: 0;
}

.juicercafe-home-strip-more {
  font-family: var(--font-sans);
  font-size: 0.875rem;
  color: var(--brand);
  text-decoration: none;
  white-space: nowrap;
}
.juicercafe-home-strip-more:hover { color: var(--brand-strong); }

/* --- "On the bar today" — menu highlight cards --- */
.juicercafe-home-menu-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
  gap: 1rem;
}
.juicercafe-home-menu-card {
  background: var(--surface);
  border: 1px solid var(--rule);
  border-radius: var(--radius-lg);
  border-left: 3px solid var(--accent);
  transition: transform 150ms ease, box-shadow 150ms ease;
}
.juicercafe-home-menu-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
}
.juicercafe-home-menu-card a {
  display: block;
  padding: 1.25rem;
  color: var(--ink);
  text-decoration: none;
}
.juicercafe-home-menu-title {
  font-family: var(--font-serif);
  font-size: 1.25rem;
  margin: 0 0 0.5rem;
  color: var(--brand-strong);
}
.juicercafe-home-menu-summary {
  margin: 0 0 0.75rem;
  color: var(--ink-soft);
  font-size: 0.9375rem;
}
.juicercafe-home-menu-link {
  font-family: var(--font-sans);
  font-size: 0.875rem;
  color: var(--brand);
  margin: 0;
}

/* --- Upcoming events strip --- */
.juicercafe-home-events-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.75rem;
}
.juicercafe-home-event {
  display: grid;
  grid-template-columns: 8rem 1fr;
  gap: 1rem;
  padding: 1rem 1.25rem;
  background: var(--surface);
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  border-left: 3px solid var(--brand);
}
.juicercafe-home-event.is-recurring { border-left-color: var(--leaf); }
.juicercafe-home-event-when {
  font-family: var(--font-sans);
  display: grid;
  align-content: center;
  text-align: center;
  background: var(--brand-soft);
  border-radius: var(--radius);
  padding: 0.5rem;
}
.juicercafe-home-event.is-recurring .juicercafe-home-event-when {
  background: rgba(138, 154, 91, 0.18);
}
.juicercafe-home-event-month {
  display: block;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--brand-strong);
}
.juicercafe-home-event.is-recurring .juicercafe-home-event-month { color: var(--leaf); }
.juicercafe-home-event-day {
  display: block;
  font-size: 0.875rem;
  color: var(--ink-soft);
  margin-top: 0.125rem;
}
.juicercafe-home-event-meta { align-self: center; }
.juicercafe-home-event-title {
  font-family: var(--font-serif);
  font-size: 1.125rem;
  margin: 0 0 0.25rem;
}
.juicercafe-home-event-title a { color: var(--ink); text-decoration: none; }
.juicercafe-home-event-title a:hover { color: var(--brand-strong); }
.juicercafe-home-event-loc {
  font-family: var(--font-sans);
  font-size: 0.875rem;
  color: var(--ink-soft);
  margin: 0;
}

/* --- Recent photos strip --- */
.juicercafe-home-photo-strip {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
  gap: 0.5rem;
}
.juicercafe-home-photo {
  aspect-ratio: 3 / 2;
  overflow: hidden;
  border-radius: var(--radius);
  background: var(--brand-soft);
}
.juicercafe-home-photo img,
.juicercafe-home-photo a {
  display: block;
  width: 100%;
  height: 100%;
}
.juicercafe-home-photo img {
  object-fit: cover;
  transition: transform 200ms ease;
}
.juicercafe-home-photo a:hover img { transform: scale(1.04); }

/* --- "Working from here?" CTA panel — homepage analogue of
       juicerchurch's I'm-new card. Espresso → caramel gradient. --- */
.juicercafe-home-working {
  margin-bottom: 3rem;
}
.juicercafe-working-cta-inner {
  background:
    linear-gradient(135deg, var(--brand-strong) 0%, var(--brand) 55%, var(--accent) 130%);
  color: var(--bg);
  padding: 2.5rem 2rem;
  border-radius: 1rem;
  text-align: center;
}
.juicercafe-working-cta-title {
  font-family: var(--font-serif);
  font-size: 2rem;
  font-style: italic;
  margin: 0 0 0.75rem;
  color: var(--bg);
}
.juicercafe-working-cta-body {
  font-size: 1.0625rem;
  max-width: 38rem;
  margin: 0 auto 1.5rem;
  color: rgba(255, 255, 255, 0.92);
}
.juicercafe-working-cta-actions {
  display: flex;
  justify-content: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}
.juicercafe-working-cta {
  display: inline-block;
  padding: 0.625rem 1.25rem;
  background: var(--bg);
  color: var(--brand-strong);
  font-family: var(--font-sans);
  font-weight: 600;
  text-decoration: none;
  border-radius: var(--radius);
  transition: transform 120ms ease;
}
.juicercafe-working-cta:hover {
  color: var(--brand-strong);
  transform: translateY(-1px);
}
.juicercafe-working-cta--secondary {
  background: transparent;
  color: var(--bg);
  border: 1px solid rgba(255, 255, 255, 0.6);
}
.juicercafe-working-cta--secondary:hover {
  color: var(--bg);
  background: rgba(255, 255, 255, 0.10);
}

/* ============================================================
   Working-card partial — used on /working/ and anywhere the theme
   inlines partials/working-card.html. Compact two-column rows.
   ============================================================ */
.juicercafe-working-card {
  margin: 0 0 2rem;
  padding: 1.5rem 1.75rem;
  background: var(--surface);
  border: 1px solid var(--rule);
  border-left: 3px solid var(--leaf);
  border-radius: var(--radius-lg);
}
.juicercafe-working-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--rule-soft);
}
.juicercafe-working-title {
  font-family: var(--font-serif);
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--brand-strong);
  margin: 0;
}
.juicercafe-working-more {
  font-family: var(--font-sans);
  font-size: 0.8125rem;
  color: var(--brand);
  text-decoration: none;
  white-space: nowrap;
}
.juicercafe-working-more:hover { color: var(--brand-strong); }
.juicercafe-working-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.625rem;
}
.juicercafe-working-item {
  display: grid;
  grid-template-columns: 7rem 1fr;
  gap: 0.75rem;
  align-items: baseline;
  font-size: 0.9375rem;
}
.juicercafe-working-label {
  font-family: var(--font-sans);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--ink-faint);
}
.juicercafe-working-value {
  color: var(--ink);
}
.juicercafe-working-value code {
  font-family: var(--font-mono);
  font-size: 0.875rem;
  background: var(--code-bg);
  border: 1px solid var(--code-border);
  border-radius: 0.25rem;
  padding: 0.125rem 0.375rem;
  color: var(--code-ink);
}
.juicercafe-working-note {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.8125rem;
  color: var(--ink-soft);
}

/* ============================================================
   Photo gallery — section index (photo-album.html), per-album
   page (album.html), and the reusable photo-grid partial.
   ============================================================ */
.juicercafe-photos-wrap { max-width: 64rem; }
.juicercafe-photos-intro { margin-bottom: 1.5rem; }

.juicercafe-album-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
  gap: 1.5rem;
}
.juicercafe-album-card {
  background: var(--surface);
  border: 1px solid var(--rule);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: transform 150ms ease, box-shadow 150ms ease;
}
.juicercafe-album-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
}
.juicercafe-album-card a {
  display: block;
  color: var(--ink);
  text-decoration: none;
}
.juicercafe-album-cover {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  background: var(--brand-soft);
}
.juicercafe-album-cover--empty {
  background:
    linear-gradient(135deg, var(--brand-soft), var(--accent));
}
.juicercafe-album-meta { padding: 1rem 1.25rem 1.25rem; }
.juicercafe-album-title {
  font-family: var(--font-serif);
  font-size: 1.25rem;
  margin: 0 0 0.25rem;
  color: var(--brand-strong);
}
.juicercafe-album-date {
  font-family: var(--font-sans);
  font-size: 0.8125rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--ink-faint);
  margin: 0 0 0.5rem;
}
.juicercafe-album-summary {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.9375rem;
}

/* Per-album page wrap + back link */
.juicercafe-album-wrap { max-width: 64rem; }
.juicercafe-album-header { margin-bottom: 1.5rem; }
.juicercafe-album-back {
  font-family: var(--font-sans);
  font-size: 0.875rem;
  margin: 0 0 0.5rem;
}
.juicercafe-album-back a {
  color: var(--brand);
  text-decoration: none;
}
.juicercafe-album-back a:hover { color: var(--brand-strong); }
.juicercafe-album-intro { margin-bottom: 2rem; }

/* Reusable photo grid (album page + future inline-photo blocks) */
.juicercafe-photo-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
  gap: 0.75rem;
}
.juicercafe-photo-tile {
  position: relative;
  margin: 0;
  background: var(--brand-soft);
  border-radius: var(--radius);
  overflow: hidden;
  aspect-ratio: 3 / 2;
}
.juicercafe-photo-tile img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.juicercafe-photo-tile.has-caption .juicercafe-photo-caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 0.625rem 0.75rem;
  background:
    linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.7) 90%);
  color: var(--bg);
  font-family: var(--font-sans);
  font-size: 0.8125rem;
  line-height: 1.3;
  opacity: 0;
  transition: opacity 150ms ease;
}
.juicercafe-photo-tile.has-caption:hover .juicercafe-photo-caption,
.juicercafe-photo-tile.has-caption:focus-within .juicercafe-photo-caption {
  opacity: 1;
}

.juicercafe-empty {
  color: var(--ink-faint);
  font-style: italic;
  text-align: center;
  padding: 2rem 0;
}

/* ============================================================
   Mobile
   ============================================================ */
@media (max-width: 640px) {
  .juicercafe-topbar-inner { flex-direction: column; align-items: flex-start; }
  .juicercafe-nav { margin-left: 0; }
  .juicercafe-hero-inner { padding: 3rem var(--gutter) 2.5rem; }
  .juicercafe-hours-row { grid-template-columns: 5rem 1fr; }
  .juicercafe-hours-note { grid-column: 2; }
  .juicercafe-event-header { grid-template-columns: 1fr; }
  .juicercafe-event-card { grid-template-columns: 5rem 1fr; }
  .juicercafe-staff-card { grid-template-columns: 4rem 1fr; gap: 1rem; padding: 1rem; }
  .juicercafe-staff-avatar { width: 4rem; height: 4rem; }
  .juicercafe-staff-page-header { grid-template-columns: 1fr; gap: 1rem; text-align: center; }
  .juicercafe-staff-page-header .juicercafe-staff-avatar--lg { margin: 0 auto; }

  /* Stage 3: home strips, photo grid, working-card */
  .juicercafe-home-event {
    grid-template-columns: 6rem 1fr;
    gap: 0.75rem;
    padding: 0.75rem;
  }
  .juicercafe-home-menu-grid {
    grid-template-columns: 1fr;
  }
  .juicercafe-album-grid {
    grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr));
    gap: 1rem;
  }
  .juicercafe-photo-grid {
    grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
  }
  /* Captions stay visible on touch — no hover state. */
  .juicercafe-photo-tile.has-caption .juicercafe-photo-caption {
    opacity: 1;
  }
  .juicercafe-working-cta-title { font-size: 1.625rem; }
  .juicercafe-working-cta-inner { padding: 1.75rem 1.25rem; }
  .juicercafe-working-item {
    grid-template-columns: 1fr;
    gap: 0.125rem;
  }
}