/**
 * ND Recipe design system — the recovered presentation authority, SCOPED.
 *
 * Ported verbatim from `visual-reference-build/assets/css/nd.css` (the
 * approved Culinary design system), then namespaced so it cannot reach
 * Listeo, WooCommerce or Dokan. Every primitive is a descendant of
 * `.nd-recipe`; the page-level resets the original performed on
 * `html, body` were removed because the active theme owns the page box.
 *
 * Do NOT "tidy" the numbers here: they are the authored design tokens.
 */

:root {
/* --- Frozen ND Palette (per Master Spec v1.4.0) --- */
  --nd-pearl:          #F7F3ED;
  --nd-ivory:          #FFFDF8;
  --nd-stone:          #E9E2D8;
  --nd-linen:          #EEE7DC;
  --nd-ink:            #151613;
  --nd-soft-ink:       #343630;
  --nd-muted:          #727068;
  --nd-champagne:      #B99B62;
  --nd-champagne-lt:   #DCC99D;
  --nd-plum:           #493246;
  --nd-sage:           #69796D;

  /* Derived tokens */
  --nd-hairline:       rgba(21, 22, 19, 0.10);
  --nd-hairline-strong:rgba(21, 22, 19, 0.20);
  --nd-hairline-champagne: rgba(185, 155, 98, 0.30);
  --nd-shadow-soft:    0 20px 40px -24px rgba(21, 22, 19, 0.16);
  --nd-shadow-card:    0 4px 24px -12px rgba(21, 22, 19, 0.10);

  /* Type */
  --nd-font-display:   "Fraunces","DM Serif Display", Georgia, serif;
  --nd-font-serif:     "Newsreader","Crimson Pro", Georgia, serif;
  --nd-font-sans:      "Geist","Söhne", -apple-system, "Helvetica Neue", Arial, sans-serif;

  /* Sizing */
  --nd-page-max:       1440px;
  --nd-page-wide:      1600px;
  --nd-nav-height:     108px; /* masthead + worlds rail */
}


/* The recovered 4vw/64px gutter, scoped so the existing
   component system (5vw/96px) is untouched elsewhere. */

.nd-recipe {
	--nd-gutter: clamp(20px, 4vw, 64px);
}

.nd-recipe,
.nd-recipe *,
.nd-recipe *::before,
.nd-recipe *::after { box-sizing: border-box;}

.nd-recipe {
  background: var(--nd-pearl);
  color: var(--nd-ink);
  font-family: var(--nd-font-sans);
  font-size: 15px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;}

.nd-recipe a { color: inherit; text-decoration: none;}

.nd-recipe img { display: block; max-width: 100%;}

.nd-recipe button { font-family: inherit; cursor: pointer;}

.nd-recipe .nd-eyebrow {
  font-family: var(--nd-font-sans);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--nd-champagne);}

.nd-recipe .nd-eyebrow-ink { color: var(--nd-ink);}

.nd-recipe .nd-eyebrow-muted { color: var(--nd-muted);}

.nd-recipe .nd-eyebrow-plum { color: var(--nd-plum);}

.nd-recipe .nd-eyebrow-sage { color: var(--nd-sage);}

.nd-recipe .nd-display {
  font-family: var(--nd-font-display);
  font-weight: 400;
  line-height: 1.02;
  letter-spacing: -0.015em;
  color: var(--nd-ink);}

.nd-recipe .nd-headline {
  font-family: var(--nd-font-display);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -0.01em;
  color: var(--nd-ink);}

.nd-recipe .nd-title {
  font-family: var(--nd-font-display);
  font-weight: 400;
  line-height: 1.14;
  color: var(--nd-ink);}

.nd-recipe .nd-deck {
  font-family: var(--nd-font-serif);
  font-weight: 400;
  font-style: italic;
  color: var(--nd-soft-ink);
  line-height: 1.4;}

.nd-recipe .nd-body {
  font-family: var(--nd-font-sans);
  font-size: 15px;
  line-height: 1.65;
  color: var(--nd-soft-ink);}

.nd-recipe .nd-serif-body {
  font-family: var(--nd-font-serif);
  font-size: 16px;
  line-height: 1.65;
  color: var(--nd-soft-ink);}

.nd-recipe .nd-byline {
  font-family: var(--nd-font-sans);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--nd-muted);}

.nd-recipe .nd-shell {
  min-height: 100vh;
  background: var(--nd-pearl);}

.nd-recipe .nd-container {
  max-width: var(--nd-page-max);
  margin: 0 auto;
  padding-left: var(--nd-gutter);
  padding-right: var(--nd-gutter);}

.nd-recipe .nd-container-wide {
  max-width: var(--nd-page-wide);
  margin: 0 auto;
  padding-left: var(--nd-gutter);
  padding-right: var(--nd-gutter);}

.nd-recipe .nd-mast {
  border-bottom: 1px solid var(--nd-hairline);
  background: rgba(247, 243, 237, 0.95);
  position: sticky; top: 0; z-index: 60;
  backdrop-filter: blur(10px);}

.nd-recipe .nd-mast-top {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 32px;
  height: 64px;}

.nd-recipe .nd-mast-logo {
  display: flex; align-items: center; gap: 10px;
  color: var(--nd-ink);}

.nd-recipe .nd-mast-logo-mark {
  width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--nd-ink);
  color: var(--nd-champagne-lt);
  font-family: var(--nd-font-display);
  font-size: 16px;
  letter-spacing: -0.02em;}

.nd-recipe .nd-mast-logo-text {
  display: flex; flex-direction: column; line-height: 1;}

.nd-recipe .nd-mast-logo-name {
  font-family: var(--nd-font-display);
  font-size: 18px;
  letter-spacing: -0.01em;}

.nd-recipe .nd-mast-logo-tagline {
  font-family: var(--nd-font-serif);
  font-style: italic;
  font-size: 11px;
  color: var(--nd-muted);
  margin-top: 2px;}

.nd-recipe .nd-mast-search {
  display: flex; align-items: center; gap: 10px;
  background: var(--nd-ivory);
  border: 1px solid var(--nd-hairline);
  padding: 10px 16px;
  max-width: 480px;
  margin: 0 auto;
  width: 100%;}

.nd-recipe .nd-mast-search input {
  border: none; outline: none; background: transparent;
  font-family: var(--nd-font-sans);
  font-size: 13px;
  flex: 1;
  color: var(--nd-ink);}

.nd-recipe .nd-mast-actions {
  display: flex; align-items: center; gap: 10px;}

.nd-recipe .nd-mast-actions .nd-btn { white-space: nowrap;}

.nd-recipe .nd-mast-icon {
  width: 36px; height: 36px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid transparent;
  background: transparent;
  color: var(--nd-ink);
  transition: border-color .15s, background .15s;}

.nd-recipe .nd-mast-icon:hover {
  border-color: var(--nd-hairline-strong);
  background: var(--nd-ivory);}

.nd-recipe .nd-worlds {
  background: var(--nd-ink);
  color: var(--nd-ivory);}

.nd-recipe .nd-worlds-inner {
  display: flex; align-items: center; gap: 0;
  height: 44px;
  overflow-x: auto; scrollbar-width: none;}

.nd-recipe .nd-worlds-inner::-webkit-scrollbar { display: none;}

.nd-recipe .nd-world-link {
  padding: 0 18px;
  height: 44px;
  display: inline-flex; align-items: center;
  font-family: var(--nd-font-sans);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--nd-champagne-lt);
  border-right: 1px solid rgba(255,255,255,0.08);
  white-space: nowrap;
  transition: color .15s, background .15s;}

.nd-recipe .nd-world-link:hover { color: var(--nd-ivory);}

.nd-recipe .nd-world-link.is-active {
  color: var(--nd-ink);
  background: var(--nd-champagne);}

.nd-recipe .nd-world-link.is-active:hover { color: var(--nd-ink);}

.nd-recipe .nd-worlds-issue {
  margin-left: auto;
  padding: 0 18px;
  font-family: var(--nd-font-serif);
  font-style: italic;
  font-size: 12px;
  color: var(--nd-champagne-lt);
  border-left: 1px solid rgba(255,255,255,0.08);
  height: 44px;
  display: inline-flex; align-items: center;
  white-space: nowrap;}

.nd-recipe .nd-btn {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 8px;
  font-family: var(--nd-font-sans);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 13px 22px;
  border: 1px solid var(--nd-ink);
  background: var(--nd-ink);
  color: var(--nd-ivory);
  cursor: pointer;
  transition: background .15s, border-color .15s, color .15s;}

.nd-recipe .nd-btn:hover { background: var(--nd-champagne); border-color: var(--nd-champagne); color: var(--nd-ink);}

.nd-recipe .nd-btn-champagne {
  background: var(--nd-champagne); border-color: var(--nd-champagne); color: var(--nd-ink);}

.nd-recipe .nd-btn-champagne:hover { background: var(--nd-ink); border-color: var(--nd-ink); color: var(--nd-ivory);}

.nd-recipe .nd-btn-ghost {
  background: transparent; color: var(--nd-ink);}

.nd-recipe .nd-btn-ghost:hover { background: var(--nd-ink); color: var(--nd-ivory); border-color: var(--nd-ink);}

.nd-recipe .nd-btn-inverse {
  background: transparent; color: var(--nd-ivory); border-color: rgba(255,255,255,0.5);}

.nd-recipe .nd-btn-inverse:hover { background: var(--nd-champagne); color: var(--nd-ink); border-color: var(--nd-champagne);}

.nd-recipe .nd-btn-sm { padding: 9px 14px; font-size: 11px;}

.nd-recipe .nd-btn-lg { padding: 17px 30px; font-size: 13px;}

.nd-recipe .nd-btn-link {
  border: none; background: transparent; padding: 0;
  color: var(--nd-ink);
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--nd-ink);
  padding-bottom: 4px;
  display: inline-flex; align-items: center; gap: 8px;
  transition: color .15s, border-color .15s, padding-right .15s;}

.nd-recipe .nd-btn-link:hover { color: var(--nd-champagne); border-color: var(--nd-champagne); padding-right: 8px;}

.nd-recipe .nd-card {
  background: var(--nd-ivory);
  border: 1px solid var(--nd-hairline);
  transition: box-shadow .2s, border-color .2s;}

.nd-recipe .nd-card:hover { box-shadow: var(--nd-shadow-soft); border-color: var(--nd-hairline-strong);}

.nd-recipe .nd-story-card { display: block; color: inherit;}

.nd-recipe .nd-story-card .nd-thumb {
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: var(--nd-stone);}

.nd-recipe .nd-story-card .nd-thumb img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .6s ease;}

.nd-recipe .nd-story-card:hover .nd-thumb img { transform: scale(1.03);}

.nd-recipe .nd-story-card .nd-meta { padding: 16px 0 0;}

.nd-recipe .nd-tag {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 5px 10px;
  border: 1px solid var(--nd-hairline-strong);
  color: var(--nd-ink);
  background: transparent;}

.nd-recipe .nd-tag-champagne { border-color: var(--nd-champagne); color: var(--nd-champagne);}

.nd-recipe .nd-tag-sage { border-color: var(--nd-sage); color: var(--nd-sage);}

.nd-recipe .nd-tag-plum { border-color: var(--nd-plum); color: var(--nd-plum);}

.nd-recipe .nd-tag-filled { background: var(--nd-ink); color: var(--nd-ivory); border-color: var(--nd-ink);}

.nd-recipe .nd-tag-champagne-filled {
  background: var(--nd-champagne); color: var(--nd-ink); border-color: var(--nd-champagne);}

.nd-recipe .nd-badge {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--nd-font-sans);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 4px 10px;
  line-height: 1.4;}

.nd-recipe .nd-badge-nd { background: var(--nd-ink); color: var(--nd-champagne-lt);}

.nd-recipe .nd-badge-vendor { background: var(--nd-plum); color: var(--nd-ivory);}

.nd-recipe .nd-badge-affiliate {
  background: var(--nd-ivory);
  color: var(--nd-soft-ink);
  border: 1px dashed var(--nd-hairline-strong);}

.nd-recipe .nd-aff {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 8px;
  font-family: var(--nd-font-sans);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: var(--nd-linen);
  color: var(--nd-soft-ink);
  border: 1px solid var(--nd-hairline);}

.nd-recipe .nd-aff-dot {
  width: 7px; height: 7px; border-radius: 50%;}

.nd-recipe .nd-aff-amazon .nd-aff-dot { background: #FF9900;}

.nd-recipe .nd-aff-instacart .nd-aff-dot { background: #43B02A;}

.nd-recipe .nd-aff-airbnb .nd-aff-dot { background: #FF5A5F;}

.nd-recipe .nd-aff-disclose {
  font-family: var(--nd-font-serif);
  font-style: italic;
  font-size: 11px;
  color: var(--nd-muted);}

.nd-recipe .nd-price {
  font-family: var(--nd-font-display);
  font-size: 22px;
  color: var(--nd-ink);
  line-height: 1;}

.nd-recipe .nd-price small {
  font-family: var(--nd-font-sans);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--nd-muted);
  margin-left: 6px;
  font-weight: 400;}

.nd-recipe .nd-rating {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--nd-font-sans);
  font-size: 12px;
  color: var(--nd-ink);}

.nd-recipe .nd-rating .nd-star { color: var(--nd-champagne); font-size: 12px;}

.nd-recipe .nd-input {
  width: 100%;
  padding: 13px 16px;
  border: 1px solid var(--nd-hairline-strong);
  background: var(--nd-ivory);
  font-family: var(--nd-font-sans);
  font-size: 14px;
  color: var(--nd-ink);
  border-radius: 0;
  transition: border-color .15s;}

.nd-recipe .nd-input:focus { outline: none; border-color: var(--nd-ink);}

.nd-recipe .nd-label {
  display: block;
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--nd-muted);
  margin-bottom: 8px;
  font-weight: 500;}

.nd-recipe .nd-select {
  appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path fill='none' stroke='%23151613' stroke-width='1.2' d='M1 1l4 4 4-4'/></svg>");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 40px;}

.nd-recipe .nd-checkbox {
  width: 18px; height: 18px;
  border: 1px solid var(--nd-hairline-strong);
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--nd-ivory);
  color: var(--nd-ink);
  flex-shrink: 0;}

.nd-recipe .nd-checkbox.is-on { background: var(--nd-ink); color: var(--nd-champagne-lt); border-color: var(--nd-ink);}

.nd-recipe .nd-rule { border: 0; border-top: 1px solid var(--nd-hairline); margin: 0;}

.nd-recipe .nd-rule-ink { border-top-color: var(--nd-ink);}

.nd-recipe .nd-rule-champagne { border-top-color: var(--nd-champagne);}

.nd-recipe .nd-footer {
  background: var(--nd-ink);
  color: var(--nd-linen);
  padding: 80px 0 40px;
  margin-top: 120px;}

.nd-recipe .nd-footer a { color: var(--nd-linen); opacity: 0.85;}

.nd-recipe .nd-footer a:hover { opacity: 1; color: var(--nd-champagne-lt);}

.nd-recipe .nd-footer h4 {
  font-family: var(--nd-font-sans);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--nd-champagne-lt);
  margin: 0 0 16px;
  font-weight: 500;}

.nd-recipe .nd-footer-grid {
  display: grid;
  grid-template-columns: 1.6fr repeat(4, 1fr);
  gap: 48px;}

.nd-recipe .nd-footer-grid ul { list-style: none; padding: 0; margin: 0;}

.nd-recipe .nd-footer-grid li { margin-bottom: 10px; font-size: 13px;}

.nd-recipe .nd-footer-bottom {
  display: flex; justify-content: space-between; align-items: center;
  padding-top: 40px; margin-top: 60px;
  border-top: 1px solid rgba(255,255,255,0.12);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(238,231,220,0.6);
  flex-wrap: wrap; gap: 16px;}

.nd-recipe .nd-section {
  padding: clamp(56px, 8vw, 96px) 0;}

.nd-recipe .nd-section-tight { padding: clamp(40px, 5vw, 64px) 0;}

.nd-recipe .nd-fade-up { animation: nd-fade-up .7s ease both;}

@keyframes nd-fade-up {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}

.nd-recipe .nd-sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); border: 0;}

.nd-recipe .nd-scroll-x { overflow-x: auto; scrollbar-width: none;}

.nd-recipe .nd-scroll-x::-webkit-scrollbar { display: none;}

@media (max-width: 1100px) {
.nd-recipe .nd-mast-search { display: none;}

.nd-recipe .nd-mast-top { grid-template-columns: auto 1fr;}

.nd-recipe .nd-mast-actions .nd-mast-hide-md { display: none;}
}

@media (max-width: 780px) {
.nd-recipe .nd-footer-grid { grid-template-columns: 1fr 1fr;}
}
