/* Ms. Maria & Mr. Singh — rebuilt from the archived Wix site.
   The palette below is NOT an interpretation. These are the site's own CSS
   custom properties, read out of the 2024-01-20 Wayback capture:

     --color_11  255,254,248   warm off-white          -> paper
     --color_15   13, 33, 35   near-black teal         -> ink
     --color_18   18, 48, 51   dark teal               -> surfaces
     --color_8    84,182,191   teal                    -> accent
     --color_7   167,217,222   pale aqua
     --color_32  248,207,169   apricot
     --color_29  202,182,41    mustard
     --color_33  240,153,73    orange

   Teal against warm off-white with apricot/mustard/orange heat is the whole
   identity — Mexican warmth and Indian spice on one plate, which is the
   restaurant's own premise.

   TYPE: the original used Lulo Clean (geometric all-caps display) over Futura
   LT Light. Both are licensed and cannot be served here, so Jost stands in for
   both — it is the closest free Futura, and at 600 in caps with wide tracking
   it reads very near Lulo Clean.

   Layout identity: a COLOUR-BLOCK hero (no photo, deep teal panel, oversized
   caps) over an asymmetric 2-up card grid. No other network site uses a solid
   colour-block hero — chefstable owns full-viewport white, messybaker the
   photo overlay, cccakes the centred 2-up. */
:root {
  --s-paper:     #FFFEF8;
  --s-surface:   #FFFEF8;
  --s-surface-2: #FBF9EB;
  --s-ink:       #0D2123;
  --s-ink-soft:  #123033;
  --s-muted:     #5F6360;
  --s-line:      #E2E2E2;
  --s-line-soft: #FBF9EB;
  --s-accent:    #54B6BF;   /* --color_8, the teal */
  /* Text that sits ON the accent. The teal is light, so this stays dark —
     but see .sat-header below: that panel is INK, not accent, so it must set
     its own colour. Leaving it to inherit --s-accent-ink put #0D2123 text on a
     #0D2123 header and the whole nav vanished. */
  --s-accent-ink:#0D2123;
  --s-accent-2:  #F09949;   /* --color_33, the orange */
  --s-display: "Jost", "Futura", "Century Gothic", sans-serif;
  --s-body:    "Jost", -apple-system, BlinkMacSystemFont, sans-serif;
  --s-radius: 0;
  --s-card-ratio: 4 / 3;
  --s-wrap: 1180px;
}

/* Chrome ------------------------------------------------------------- */
.sat-header {
  /* colour MUST be set here. satellite.css pairs .sat-header's background with
     var(--s-accent-ink); overriding only the background leaves dark-on-dark. */
  background: var(--s-ink); color: var(--s-paper);
  border-bottom: 3px solid var(--s-accent);
}
.sat-header a { color: var(--s-paper); }
.sat-nav a { color: var(--s-paper); opacity: .9; }
.sat-nav a:hover { opacity: 1; color: var(--s-accent); }
.sat-nav-toggle { color: var(--s-paper); border-color: var(--s-paper); }
.sat-logo {
  font-family: var(--s-display); text-transform: uppercase;
  letter-spacing: .16em; font-weight: 600; font-size: .92rem;
}
.sat-logo em { font-style: normal; color: var(--s-accent-2); }
.sat-nav a {
  text-transform: uppercase; letter-spacing: .12em; font-size: .72rem; font-weight: 500;
}
.sat-btn {
  border-radius: 0; text-transform: uppercase; letter-spacing: .14em;
  font-weight: 600; font-size: .74rem; padding: 15px 32px;
  background: var(--s-accent-2); color: var(--s-ink); border: none;
}
.sat-btn:hover { background: var(--s-accent); }
.sat-eyebrow {
  text-transform: uppercase; letter-spacing: .22em; font-size: .66rem;
  color: var(--s-accent); font-weight: 600;
}
h1, h2, h3 { font-family: var(--s-display); font-weight: 600; letter-spacing: .03em; }

/* ── Layout identity: colour-block hero, asymmetric 2-up ─────────────── */
.sat-hero { background: var(--s-ink); padding: 0; }
.sat-hero-grid { grid-template-columns: 1fr; gap: 0; position: static; }
.sat-hero-img { display: none; }
.sat-hero-text {
  position: static; padding: 92px 0 84px; text-align: center; color: #fff;
}
.sat-hero-brand {
  font-family: var(--s-display); text-transform: uppercase; font-weight: 600;
  font-size: clamp(2rem, 6vw, 4.4rem); letter-spacing: .12em;
  line-height: 1.06; color: #fff; margin: 0 0 18px;
}
.sat-hero-feature {
  font-weight: 300; font-size: clamp(1rem, 2.4vw, 1.5rem);
  letter-spacing: .22em; text-transform: uppercase; color: var(--s-accent); margin: 0;
}
.sat-hero-text .sat-lede { color: rgba(255,255,255,.82); max-width: 56ch; margin: 24px auto 0; }
.ms-flame { color: var(--s-accent-2); }

.sat-section-head { border-bottom: 3px solid var(--s-accent); padding-bottom: 12px; margin-bottom: 32px; }
.sat-section-head h2 {
  text-transform: uppercase; letter-spacing: .16em; font-size: 1.35rem; font-weight: 600;
}
.sat-grid-4, .sat-grid-3 { grid-template-columns: repeat(2, 1fr); gap: 46px 40px; }
.sat-card { gap: 0; }
.sat-card-img { border-radius: 0; margin-bottom: 14px; }
.sat-card-title { font-family: var(--s-display); font-weight: 600; font-size: 1.08rem; letter-spacing: .02em; }
.sat-card-meta {
  order: -1; text-transform: uppercase; letter-spacing: .18em;
  font-size: .62rem; color: var(--s-accent); font-weight: 600; margin-bottom: 8px;
}
.sat-card-desc { color: var(--s-muted); margin-top: 8px; }
.sat-ingredients, .sat-facts { border-radius: 0; border-top: 3px solid var(--s-accent-2); }
.sat-footer { background: var(--s-ink); border-top: 3px solid var(--s-accent); }

/* ── Mobile ─────────────────────────────────────────────────────────────
   The 2-up above is unconditional and this file loads after satellite.css,
   so the collapse has to be restated here. */
@media (max-width: 700px) {
  .sat-grid-4, .sat-grid-3 { grid-template-columns: 1fr; gap: 30px; }
  .sat-hero-text { padding: 60px 0 54px; }
}
