/* ==========================================================================
   ZillOut Grow — dine-in theme (/grow/dinein)
   Same page, same structure: warm cream base, terracotta and burgundy,
   candlelit photography, a serif voice for the headings.
   Scoped under html.theme-dinein.
   ========================================================================== */

@import url("https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400..700;1,9..144,400..700&display=swap");

.theme-dinein .grow-body {
  --g-50: #faf3e8;
  --g-100: #eddcc3;
  --g-400: #d97941;
  --g-500: #c05621;
  --g-600: #9c4118;
  --g-900: #3a2415;
  --g-leaf: #b3652f;
  --g-mint: #f2c48d;
  --g-cta: #c05621;
  --g-amber-bg: #fdf8ee;
  --g-amber-border: #e6d3ae;
  --g-amber-strip: #f6e8c9;
  --g-amber-text: #a4550f;
  --g-potential: #b23a3a;
  --g-badge: #f4e3bb;
  --g-ink: #33231a;
  --g-gray-500: #8a7563;
  --g-gray-600: #6b5546;
  --g-gray-200: #e8ddcd;
  --g-gray-100: #f2ead9;
  background: #f7f0e4;
  color: var(--g-ink);
}

.theme-dinein .grow-body[data-grow-view="feature"] {
  background: #fdf9f1;
}

/* Headings speak in a serif — the dining-room voice. */
.theme-dinein .g-hero-title,
.theme-dinein .g-bhero-title,
.theme-dinein .g-ftitle,
.theme-dinein .g-card-grid .g-card-title,
.theme-dinein .g-row-title,
.theme-dinein .g-loop-line,
.theme-dinein .g-tail .section-title,
.theme-dinein .g-tail .location-header-text h3,
.theme-dinein .g-tail .news-title {
  font-family: "Fraunces", "Clash Display", serif;
}

/* ---- hero: a candlelit table ---- */

.theme-dinein .g-hero {
  background:
    linear-gradient(
      160deg,
      rgba(36, 17, 8, 0.82) 0%,
      rgba(28, 13, 6, 0.88) 55%,
      rgba(20, 9, 4, 0.95) 100%
    ),
    url("../images/grow/themes/dinein-hero.webp") center / cover no-repeat;
}

.theme-dinein .g-hero-grid {
  background-image:
    linear-gradient(rgba(217, 121, 65, 0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(217, 121, 65, 0.08) 1px, transparent 1px);
}

.theme-dinein .g-hero-eyebrow {
  color: #f2c48d;
}

.theme-dinein .g-hero-title-accent {
  color: #f5b880;
}

/* ---- cards: warm paper ---- */

.theme-dinein .g-card {
  background: #fdf8ee;
  border-color: #e6d3ae;
}

.theme-dinein .g-card-grid::before,
.theme-dinein .g-card-row::before {
  background:
    radial-gradient(circle at 22% 28%, rgba(217, 121, 65, 0.14), transparent 42%),
    radial-gradient(circle at 78% 72%, rgba(178, 58, 58, 0.1), transparent 42%),
    radial-gradient(circle at 65% 20%, rgba(242, 196, 141, 0.14), transparent 38%);
}

.theme-dinein .g-card-grid:hover {
  box-shadow: 0 14px 36px rgba(156, 65, 24, 0.14);
}

.theme-dinein .g-uplift {
  background: #f9ecd9;
  border-color: #eddcc3;
  color: var(--g-600);
}

.theme-dinein .g-strip-view {
  background: #fff;
  border-color: #e6d3ae;
  color: #a4550f;
}

.theme-dinein .g-strip-view:hover {
  border-color: #a4550f;
}

/* ---- flywheel panel, growth bar, sticky CTA ---- */

.theme-dinein .g-loop {
  border-color: rgba(242, 196, 141, 0.4);
  background:
    linear-gradient(
      145deg,
      rgba(74, 25, 30, 0.9) 0%,
      rgba(54, 17, 21, 0.94) 55%,
      rgba(36, 11, 13, 0.96) 100%
    ),
    url("../images/grow/themes/dinein-interior.webp") center / cover no-repeat;
  box-shadow: 0 12px 36px rgba(74, 25, 30, 0.3);
}

.theme-dinein .g-loop-icon {
  background: #f2c48d;
  color: #4a191e;
}

.theme-dinein .g-loop-note {
  color: #e3c3ab;
}

.theme-dinein .g-planbar-inner {
  background: linear-gradient(145deg, #6b2429 0%, #4a191e 45%, #2e0f12 100%);
  border-color: rgba(242, 196, 141, 0.4);
  box-shadow: 0 8px 28px rgba(46, 15, 18, 0.4);
}

.theme-dinein .g-planbar-fill {
  background: linear-gradient(90deg, #d97941, #f2c48d);
}

.theme-dinein .g-planbar-cap {
  color: #f2c48d;
}

.theme-dinein .g-fcta-fixed {
  background: #fdf9f1;
  border-top-color: #e8ddcd;
}

/* ---- trust tail ---- */

.theme-dinein .g-tail {
  --card-bg: #fdf9f1;
  --text-primary: #3a2415;
  --text-secondary: #6b5546;
  --text-brand: #3a2415;
  --primary-color: #9c4118;
}

.theme-dinein .g-tail .section-title {
  color: #3a2415 !important;
}

.theme-dinein .g-tail .section-subtitle {
  color: #8a7563;
}

.theme-dinein .g-tail .locations-carousel {
  border-color: #e6d3ae;
  background: #fbf5e9;
}

.theme-dinein .g-tail .location-header-text h3 {
  color: #3a2415;
}

.theme-dinein .g-tail .location-name.highlighted {
  color: #c05621;
}

.theme-dinein .g-tail .location-nav {
  background: #fff;
  border-color: #e6d3ae;
  color: #9c4118;
}

.theme-dinein .g-tail .venue-card {
  border-color: #e6d3ae;
}

.theme-dinein .g-tail .news-card,
.theme-dinein .g-tail .certification-card,
.theme-dinein .g-tail .blog-card {
  background: #fdf9f1;
  border-color: #eddcc3;
}

.theme-dinein .g-tail .news-title,
.theme-dinein .g-tail .certification-title {
  color: #3a2415;
}

.theme-dinein .g-tail .news-description {
  color: #6b5546;
}

.theme-dinein .g-tail .news-button {
  background: var(--g-500);
}

.theme-dinein .g-tail .news-button:hover {
  background: var(--g-600);
}

.theme-dinein .g-tail .from-blog-cta-link:hover {
  background: #faf3e8;
}

.theme-dinein .g-tail .blog-card:hover {
  box-shadow: 0 20px 50px rgba(156, 65, 24, 0.16);
}

/* ---- footer: warm cream card ---- */

.theme-dinein .footer-inner.white-theme {
  background: #fdf9f1;
}
