/*
Theme Name: Jai Pui
Theme URI: https://example.com/
Author: Jai Pui
Description: Premium, responsive B2B hospitality theme for Jai Pui, designed to work cleanly with Elementor.
Version: 2.0.10
Requires at least: 6.2
Tested up to: 6.7
Requires PHP: 7.4
Text Domain: jai-pui
*/

:root {
  --jp-ink: #17362a;
  --jp-ink-deep: #102d23;
  --jp-green-soft: #1d2f24;
  --jp-paper: #f6f2ed;
  --jp-paper-2: #f3eee7;
  --jp-cream: #f1eae2;
  --jp-gold: #bd8f47;
  --jp-gold-light: #d8b56d;
  --jp-brown: #33241f;
  --jp-muted: #4f514d;
  --jp-line: rgba(16,45,35,.14);
  --jp-frame: 1024px;
  --jp-split: 44%;
  --jp-serif: Baskerville, "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, Georgia, serif;
  --jp-sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  overflow-x: hidden;
  color: var(--jp-ink-deep);
  background: var(--jp-paper);
  font-family: var(--jp-sans);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }
button, input, textarea, select { font: inherit; }
.jp-site-frame { width: min(100%, var(--jp-frame)); margin-inline: auto; }
.jp-display {
  margin: 0;
  font-family: var(--jp-serif);
  font-weight: 400;
  letter-spacing: -.035em;
  line-height: .98;
}
.jp-eyebrow {
  margin: 0 0 9px;
  color: var(--jp-gold);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .27em;
  text-transform: uppercase;
}
.jp-gold-rule {
  display: block;
  width: 43px;
  height: 3px;
  margin: 18px 0 20px;
  background: var(--jp-gold);
}
.jp-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  min-height: 44px;
  padding: 0 28px;
  border: 0;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  transition: transform .18s ease, filter .18s ease;
}
.jp-button:hover { transform: translateY(-1px); filter: brightness(.97); }
.jp-button--gold { background: linear-gradient(90deg, #c99e55 0%, #dfbd72 100%); color: #181a17; }

/* Header */
.jp-header {
  position: relative;
  z-index: 50;
  background: #f6f2ed;
  border-bottom: 1px solid rgba(16,45,35,.06);
}
.jp-header__shell {
  position: relative;
  width: min(100%, var(--jp-frame));
  min-height: 103px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: 185px minmax(0, 1fr) 176px;
  grid-template-rows: 34px 69px;
  column-gap: 24px;
  padding: 0 42px;
}
.jp-brand {
  display: block;
  line-height: 0;
}
.jp-brand--header {
  position: relative;
  grid-column: 1;
  grid-row: 1 / 3;
  width: 185px;
  height: 103px;
  align-self: stretch;
  overflow: visible;
}
.jp-brand__image {
  display: block;
  width: 185px;
  height: auto;
  max-width: none;
}
.jp-brand--header .jp-brand__image {
  position: absolute;
  top: 0;
  left: 0;
}
.jp-header__strap {
  grid-column: 2 / 4;
  grid-row: 1;
  align-self: end;
  justify-self: end;
  margin: 0 0 3px;
  color: #23332c;
  text-align: right;
  font-size: 7.5px;
  font-weight: 750;
  letter-spacing: .31em;
  line-height: 1.5;
  text-transform: uppercase;
}
.jp-nav {
  grid-column: 2;
  grid-row: 2;
  align-self: center;
  justify-self: stretch;
  width: 100%;
}
.jp-nav ul,
.jp-nav .jp-menu {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 32px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.jp-nav a {
  position: relative;
  display: block;
  padding: 9px 0;
  color: #222824;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.2;
  white-space: nowrap;
}
.jp-nav .current-menu-item > a,
.jp-nav a:hover { color: #8e6731; }
.jp-nav .current-menu-item > a::after,
.jp-nav a:hover::after {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -5px;
  height: 1px;
  background: var(--jp-gold);
  content: "";
}
.jp-header__cta {
  grid-column: 3;
  grid-row: 2;
  align-self: center;
  justify-self: stretch;
  min-height: 40px;
  padding-inline: 18px;
  font-size: 10.5px;
  white-space: nowrap;
}
.jp-menu-toggle { display: none; }

/* Hero */
.jp-hero { background: var(--jp-paper-2); }
.jp-hero__grid {
  display: grid;
  grid-template-columns: var(--jp-split) calc(100% - var(--jp-split));
  align-items: stretch;
  height: 462px;
}
.jp-hero__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 40px 38px 36px 53px;
  background: linear-gradient(90deg, #f6f2ed 0%, #f4f0e9 78%, #efede8 100%);
}
.jp-hero h1 {
  color: var(--jp-ink-deep);
  font-size: 53px;
  line-height: .985;
}
.jp-hero__lead {
  max-width: 420px;
  margin: 0 0 21px;
  color: #2f3833;
  font-size: 15.5px;
  line-height: 1.5;
}
.jp-hero__signoff {
  margin: 15px 0 0;
  color: #53645c;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .32em;
  text-transform: uppercase;
}
.jp-hero__media {
  overflow: hidden;
  height: 100%;
  background: #cfc8bc;
}
.jp-hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: center center; }

/* Hospitality promise */
.jp-promise {
  background: linear-gradient(135deg, #253226 0%, #193126 58%, #1c2d23 100%);
}
.jp-promise__grid {
  display: grid;
  grid-template-columns: var(--jp-split) calc(100% - var(--jp-split));
  align-items: stretch;
  height: 290px;
}
.jp-promise__copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 32px 40px 31px 53px;
  color: #fff;
}
.jp-promise__copy .jp-gold-rule { margin: 0 0 18px; }
.jp-promise h2 {
  color: #fff;
  font-size: 38px;
  line-height: 1.0;
}
.jp-promise p {
  max-width: 430px;
  margin: 20px 0 0;
  color: rgba(255,255,255,.88);
  font-size: 15px;
  line-height: 1.52;
}
.jp-promise__media { overflow: hidden; height: 100%; background: var(--jp-brown); }
.jp-promise__media img { width: 100%; height: 100%; object-fit: cover; object-position: center center; }

/* Process */
.jp-process { background: #f7f4ee; }
.jp-process__inner { padding: 28px 44px 0; text-align: center; }
.jp-process .jp-eyebrow { margin-bottom: 8px; }
.jp-process h2 { font-size: 32px; line-height: 1.08; }
.jp-process__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-top: 20px;
  border-top: 1px solid var(--jp-line);
}
.jp-step {
  position: relative;
  min-height: 211px;
  padding: 25px 18px 18px;
  border-right: 1px solid var(--jp-line);
}
.jp-step:last-child { border-right: 0; }
.jp-step__icon {
  width: 61px;
  height: 61px;
  margin: 0 auto 14px;
  display: grid;
  place-items: center;
  border: 1px solid var(--jp-ink-deep);
  border-radius: 50%;
}
.jp-step__icon svg { width: 34px; height: 34px; fill: none; stroke: var(--jp-ink-deep); stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }
.jp-step__number {
  position: absolute;
  top: 70px;
  left: calc(50% + 15px);
  display: grid;
  place-items: center;
  width: 23px;
  height: 23px;
  border-radius: 50%;
  background: var(--jp-gold);
  color: #fff;
  font-size: 10px;
}
.jp-step h3 {
  margin: 0 0 10px;
  color: var(--jp-ink-deep);
  font-size: 11.5px;
  font-weight: 750;
  letter-spacing: .17em;
  text-transform: uppercase;
}
.jp-step p {
  max-width: 218px;
  margin: 0 auto;
  color: #5b5b56;
  font-size: 13.5px;
  line-height: 1.5;
}

/* Training/support */
.jp-support { background: var(--jp-cream); }
.jp-support__grid { display: grid; grid-template-columns: var(--jp-split) calc(100% - var(--jp-split)); align-items: stretch; height: 220px; }
.jp-support__media { overflow: hidden; height: 100%; }
.jp-support__media img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.jp-support__copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 26px 44px;
}
.jp-support__copy .jp-gold-rule { margin: 0 0 17px; }
.jp-support h2 { font-size: 31px; line-height: 1.06; }
.jp-support p {
  max-width: 540px;
  margin: 14px 0 0;
  color: #444844;
  font-size: 14.5px;
  line-height: 1.55;
}

/* CTA */
.jp-cta {
  position: relative;
  overflow: hidden;
  color: #fff;
  background: #1d2f24;
}
.jp-cta::before {
  position: absolute;
  inset: 0;
  background-image: linear-gradient(90deg, rgba(26,44,33,.36), rgba(26,44,33,.20)), url('assets/images/leaf-texture.jpg');
  background-position: center;
  background-size: cover;
  opacity: .86;
  content: "";
}
.jp-cta__grid {
  position: relative;
  z-index: 1;
  min-height: 165px;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 38px;
  padding: 25px 44px 25px 58px;
}
.jp-cta h2 { font-size: 29px; line-height: 1.06; }
.jp-cta .jp-eyebrow { color: var(--jp-gold-light); }
.jp-cta__action { display: flex; flex-direction: column; align-items: center; gap: 11px; }
.jp-cta__action .jp-button { min-width: 198px; }
.jp-cta__action small { font-size: 9px; font-weight: 650; letter-spacing: .21em; text-transform: uppercase; }

/* Footer */
.jp-footer {
  background: #f6f2ed;
  color: var(--jp-ink-deep);
  border-top: 1px solid rgba(16,45,35,.10);
}
.jp-footer__inner {
  min-height: 126px;
  display: grid;
  grid-template-columns: 160px minmax(0,1fr) 92px;
  align-items: center;
  gap: 24px;
  padding: 18px 24px;
}
.jp-brand--footer {
  width: 160px;
}
.jp-brand--footer .jp-brand__image {
  width: 160px;
}
.jp-footer__nav ul,
.jp-footer__nav .jp-menu {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.jp-footer__nav a {
  font-size: 15px;
  line-height: 1.4;
  font-weight: 450;
  color: #2f3c35;
}
.jp-footer__nav a:hover { color: #8e6731; }
.jp-footer small {
  font-size: 13.5px;
  line-height: 1.4;
  color: #657069;
  white-space: nowrap;
}

/* Standard WordPress pages remain intentionally spare until built in Elementor. */
.jp-page-shell { min-height: 56vh; padding: 54px 0 78px; background: var(--jp-paper); }
.jp-page-shell > .jp-wrap,
.jp-wrap { width: min(calc(100% - 64px), 1120px); margin-inline: auto; }
.jp-page-header { margin-bottom: 34px; }
.jp-page-header h1 { font-size: clamp(40px, 4.2vw, 56px); }
.jp-content { color: #2b332e; }
.jp-content > * { max-width: 820px; }
.jp-content > .alignwide { max-width: 1120px; }
.jp-content > .alignfull { width: 100vw; max-width: none; margin-left: calc(50% - 50vw); }

.screen-reader-text { position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.screen-reader-text:focus { position:fixed!important; left:8px; top:8px; width:auto; height:auto; margin:0; padding:12px 16px; clip:auto; background:#fff; color:#111; z-index:100000; }

@media (max-width: 980px) and (min-width: 881px) {
  .jp-header__shell { grid-template-columns: 170px minmax(0,1fr) 154px; column-gap: 14px; padding-inline: 22px; }
  .jp-brand--header { width: 164px; }
  .jp-brand--header .jp-brand__image { width: 164px; left: 0; }
  .jp-nav ul, .jp-nav .jp-menu { gap: 20px; }
  .jp-nav a { font-size: 15px; }
  .jp-header__cta { padding-inline: 14px; font-size: 9.5px; }
  .jp-header__strap { font-size: 6.5px; }
  .jp-hero__copy { padding-left: 44px; padding-right: 34px; }
  .jp-hero h1 { font-size: 52px; }
  .jp-promise__copy { padding-left: 44px; padding-right: 30px; }
}

@media (max-width: 880px) {
  .jp-header__shell { height: 86px; grid-template-columns: 1fr auto; grid-template-rows: 86px; align-items: center; padding: 0 22px; }
  .jp-brand--header { grid-column: 1; grid-row: 1; width: 150px; height: 86px; }
  .jp-brand--header .jp-brand__image { position: absolute; width: 150px; top: -5px; left: -2px; }
  .jp-header__strap, .jp-header__cta { display: none; }
  .jp-menu-toggle {
    display: block;
    width: 42px;
    height: 42px;
    padding: 9px;
    border: 0;
    background: transparent;
    cursor: pointer;
  }
  .jp-menu-toggle span { display:block; height:2px; margin:5px 0; background:var(--jp-ink-deep); }
  .jp-nav {
    display: none;
    position: absolute;
    top: 86px;
    left: 0;
    right: 0;
    background: var(--jp-paper);
    border-top: 1px solid var(--jp-line);
    box-shadow: 0 14px 30px rgba(0,0,0,.08);
  }
  .jp-nav.is-open { display: block; }
  .jp-nav ul, .jp-nav .jp-menu { display: block; padding: 12px 24px 20px; }
  .jp-nav li { border-bottom: 1px solid var(--jp-line); }
  .jp-nav li:last-child { border-bottom: 0; }
  .jp-nav a { padding: 14px 4px; font-size: 16px; }
  .jp-nav .current-menu-item > a::after, .jp-nav a:hover::after { display:none; }

  .jp-hero__grid { grid-template-columns: 1fr; height: auto; }
  .jp-hero__copy { padding: 48px 34px 42px; }
  .jp-hero h1 { font-size: clamp(52px, 11vw, 68px); }
  .jp-hero__lead { max-width: 620px; font-size: 16px; }
  .jp-hero__media { height: auto; aspect-ratio: 594 / 462; }

  .jp-promise__grid { grid-template-columns: 1fr; height: auto; }
  .jp-promise__copy { padding: 48px 34px; }
  .jp-promise h2 { font-size: clamp(42px, 9.8vw, 58px); }
  .jp-promise__media { height: auto; aspect-ratio: 564 / 290; }

  .jp-process__inner { padding: 52px 28px 28px; }
  .jp-process__grid { grid-template-columns: 1fr 1fr; }
  .jp-step:nth-child(2) { border-right: 0; }
  .jp-step:nth-child(-n+2) { border-bottom: 1px solid var(--jp-line); }

  .jp-support__grid { grid-template-columns: 1fr; height: auto; }
  .jp-support__media { height: auto; aspect-ratio: 512 / 213; }
  .jp-support__copy { padding: 44px 34px 48px; }
  .jp-support h2 { font-size: 38px; }

  .jp-cta__grid { grid-template-columns: 1fr; gap: 26px; padding: 40px 34px; }
  .jp-cta__action { align-items: flex-start; }

  .jp-footer__inner { grid-template-columns: 1fr; gap: 20px; padding: 30px 24px 34px; }
  .jp-brand--footer { width: 160px; }
  .jp-brand--footer .jp-brand__image { width: 160px; }
  .jp-footer__nav ul, .jp-footer__nav .jp-menu { justify-content: flex-start; gap: 16px 28px; }
  .jp-footer__nav a { font-size: 16px; }
  .jp-footer small { font-size: 14.5px; }
}

@media (max-width: 520px) {
  .jp-header__shell { height: 78px; grid-template-rows: 78px; padding-inline: 17px; }
  .jp-nav { top: 78px; }
  .jp-brand--header { width: 142px; height: 78px; }
  .jp-brand--header .jp-brand__image { width: 142px; top: -5px; left: -2px; }
  .jp-hero__copy { padding: 40px 23px 34px; }
  .jp-hero h1 { font-size: 49px; line-height: .95; }
  .jp-gold-rule { margin: 17px 0 19px; }
  .jp-hero__lead { margin-bottom: 22px; }
  .jp-button { width: 100%; max-width: 290px; }
  .jp-hero__media { min-height: 350px; aspect-ratio: auto; }
  .jp-hero__media img { object-position: 58% center; }

  .jp-promise__copy { padding: 40px 23px; }
  .jp-promise h2 { font-size: 42px; }
  .jp-promise__media { min-height: 250px; aspect-ratio: auto; }
  .jp-promise__media img { object-position: 53% center; }

  .jp-process__inner { padding: 46px 20px 18px; }
  .jp-process h2 { font-size: 35px; }
  .jp-process__grid { grid-template-columns: 1fr; }
  .jp-step { min-height: auto; border-right: 0; border-bottom: 1px solid var(--jp-line); padding: 31px 18px 29px; }
  .jp-step:last-child { border-bottom: 0; }
  .jp-step__number { top: 79px; }

  .jp-support__media { min-height: 240px; aspect-ratio: auto; }
  .jp-support__copy { padding: 38px 23px 42px; }
  .jp-support h2 { font-size: 38px; }

  .jp-cta__grid { min-height: 0; padding: 38px 23px 42px; }
  .jp-cta h2 { font-size: 35px; }
  .jp-cta h2 br { display: none; }

  .jp-footer__nav ul, .jp-footer__nav .jp-menu { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 22px; }
  .jp-footer__nav a { font-size: 16px; }
  .jp-footer small { font-size: 14px; }
}

/* Fidelity corrections: preserve the approved 1024px composition exactly. */
@media (min-width: 981px) {
  .jp-hero__copy,
  .jp-hero__media,
  .jp-promise__copy,
  .jp-promise__media { min-height: 0; height: 100%; }
}

/* =========================================================
   Restaurants & Pubs — unified site build v2.0.4
   Uses the SAME 1024px site frame, header and footer as Home.
   The signed-off 846px composition is proportionally scaled
   into the global site system rather than shrinking the site.
   ========================================================= */
.jp-trade-page { background:#f7f4ef; }
.jp-trade-page .jp-site-frame { width:min(100%, var(--jp-frame)); }

/* Hero: 41.6 / 58.4 split from signed-off artwork, at global scale */
.jp-trade-hero { background:#f6f1eb; }
.jp-trade-hero__grid {
  display:grid;
  grid-template-columns:41.6% 58.4%;
  min-height:437px;
  height:437px;
  overflow:hidden;
}
.jp-trade-hero__copy {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  padding:42px 28px 34px 53px;
  background:linear-gradient(90deg,#f7f3ee 0%,#f7f3ee 84%,#f2eee8 100%);
}
.jp-trade-hero__copy h1 {
  margin:0;
  color:var(--jp-ink-deep);
  font-size:56px;
  line-height:.965;
  letter-spacing:-.045em;
}
.jp-trade-hero__copy h1 span { display:block; }
.jp-trade-hero__copy .jp-gold-rule { width:45px; height:3px; margin:17px 0 17px; }
.jp-trade-hero__copy > p:not(.jp-trade-hero__signoff) {
  max-width:350px;
  margin:0 0 20px;
  color:#303833;
  font-size:15.5px;
  line-height:1.47;
}
.jp-trade-hero__copy .jp-button {
  min-width:234px;
  min-height:43px;
  padding:0 23px;
  gap:23px;
  font-size:10.5px;
}
.jp-trade-hero__signoff {
  margin:13px 0 0;
  color:#53645c;
  font-size:8.5px;
  font-weight:700;
  letter-spacing:.31em;
  text-transform:uppercase;
}
.jp-trade-hero__media {
  position:relative;
  height:437px;
  overflow:hidden;
  background:#241d17;
}
.jp-trade-hero__media img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 50%;
  filter:saturate(1.03) contrast(1.03) brightness(.93);
}

/* Product families */
.jp-ranges { background:#f8f5f0; }
.jp-ranges__inner { padding:32px 52px 38px; }
.jp-section-intro .jp-gold-rule { width:35px; height:3px; margin:0 0 14px; }
.jp-section-intro h2 {
  margin:0;
  color:var(--jp-ink-deep);
  font-size:46px;
  line-height:1;
  letter-spacing:-.04em;
}
.jp-section-intro p { margin:9px 0 0; color:#4e5550; font-size:15px; line-height:1.45; }
.jp-ranges__grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:15px;
  margin-top:22px;
}
.jp-range-card {
  position:relative;
  min-width:0;
  padding:0 14px 3px 0;
  display:flex;
  flex-direction:column;
}
.jp-range-card:not(:last-child)::after {
  position:absolute;
  top:207px;
  right:-1px;
  bottom:0;
  width:1px;
  background:rgba(16,45,35,.13);
  content:"";
}
.jp-range-card:last-child { padding-right:0; }
.jp-range-card img {
  width:100%;
  height:194px;
  margin:0 0 10px;
  object-fit:cover;
  object-position:center;
}
.jp-range-card h3 {
  margin:0 0 6px;
  min-height:27px;
  color:var(--jp-ink-deep);
  font-size:22px;
  line-height:1.05;
  letter-spacing:-.03em;
}
.jp-range-card p {
  min-height:75px;
  margin:0 0 13px;
  color:#505550;
  font-size:13.5px;
  line-height:1.44;
}
.jp-range-card a {
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:auto;
  color:#203229;
  font-size:9.7px;
  font-weight:750;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.jp-range-card a:hover { color:#8e6731; }

/* Operational proposition */
.jp-trade-benefits {
  color:#fff;
  background:linear-gradient(135deg,#153a2a 0%,#103325 58%,#18392b 100%);
}
.jp-trade-benefits__inner { padding:25px 53px 31px; }
.jp-trade-benefits__top {
  display:grid;
  grid-template-columns:1.12fr .88fr;
  gap:63px;
  align-items:start;
}
.jp-trade-benefits__top .jp-gold-rule { width:35px; height:3px; margin:0 0 12px; background:#d5a95d; }
.jp-trade-benefits__top h2 { margin:0; color:#fff; font-size:38px; line-height:1.03; letter-spacing:-.03em; }
.jp-trade-benefits__top p { margin:0; padding-top:20px; color:rgba(255,255,255,.89); font-size:14px; line-height:1.48; }
.jp-trade-benefits__grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin-top:27px;
}
.jp-trade-benefits__grid article {
  padding:0 18px;
  text-align:center;
  border-right:1px solid rgba(216,181,109,.35);
}
.jp-trade-benefits__grid article:last-child { border-right:0; }
.jp-trade-icon {
  width:67px;
  height:67px;
  display:grid;
  place-items:center;
  margin:0 auto 11px;
  border:1px solid #d8b56d;
  border-radius:50%;
}
.jp-trade-icon svg { width:38px; height:38px; fill:none; stroke:#d8b56d; stroke-width:1.45; stroke-linecap:round; stroke-linejoin:round; }
.jp-trade-benefits h3 { margin:0 0 5px; color:#fff; font-size:10.5px; font-weight:750; letter-spacing:.16em; line-height:1.3; text-transform:uppercase; }
.jp-trade-benefits__grid p { margin:0 auto; color:rgba(255,255,255,.84); font-size:13px; line-height:1.4; }

/* Real-food mosaic */
.jp-trade-gallery { background:#f8f5f0; }
.jp-trade-gallery__inner { padding:30px 52px 34px; }
.jp-trade-gallery__heading {
  display:grid;
  grid-template-columns:1fr 288px;
  gap:41px;
  align-items:end;
  margin-bottom:19px;
}
.jp-trade-gallery__heading .jp-gold-rule { width:35px; height:3px; margin:0 0 13px; }
.jp-trade-gallery__heading h2 { margin:0; font-size:44px; line-height:1; letter-spacing:-.04em; }
.jp-trade-gallery__heading p { margin:0 0 2px; color:#555a56; font-size:14px; line-height:1.45; }
.jp-trade-gallery__grid {
  display:grid;
  grid-template-columns:29.4fr 31.6fr 29fr;
  gap:11px;
  height:357px;
}
.jp-trade-gallery figure { margin:0; overflow:hidden; background:#ddd5ca; }
.jp-trade-gallery img { width:100%; height:100%; object-fit:cover; object-position:center; }
.jp-gallery-stack { display:grid; grid-template-rows:1fr 1fr; gap:11px; min-height:0; }
.jp-gallery-stack figure { min-height:0; }

/* CTA */
.jp-trade-cta {
  position:relative;
  overflow:hidden;
  color:#fff;
  background:#173428;
}
.jp-trade-cta::before {
  position:absolute;
  inset:0;
  background-image:linear-gradient(90deg,rgba(19,51,38,.58),rgba(19,51,38,.75)),url('assets/images/leaf-texture.jpg');
  background-size:cover;
  background-position:center;
  opacity:.95;
  content:"";
}
.jp-trade-cta__grid {
  position:relative;
  z-index:1;
  min-height:201px;
  display:grid;
  grid-template-columns:1.06fr .94fr;
  gap:70px;
  align-items:center;
  padding:29px 54px;
}
.jp-trade-cta .jp-eyebrow { margin:0 0 9px; color:#d8b56d; font-size:9.8px; letter-spacing:.24em; }
.jp-trade-cta h2 { margin:0; color:#fff; font-size:39px; line-height:1.02; }
.jp-trade-cta__copy p { max-width:375px; margin:0 0 16px; color:rgba(255,255,255,.88); font-size:14px; line-height:1.46; }
.jp-trade-cta__copy .jp-button { min-width:223px; min-height:43px; padding:0 24px; font-size:10.4px; }
.jp-trade-cta__copy small { display:block; margin-top:8px; font-size:8.5px; font-weight:650; letter-spacing:.18em; text-transform:uppercase; }

/* Tablet: keep the same site system as Home; only the page content reflows. */
@media (max-width:880px) {
  .jp-trade-hero__grid { grid-template-columns:1fr; height:auto; min-height:0; }
  .jp-trade-hero__copy { padding:46px 34px 40px; }
  .jp-trade-hero__copy h1 { font-size:clamp(48px,9vw,62px); }
  .jp-trade-hero__copy > p:not(.jp-trade-hero__signoff) { max-width:560px; font-size:16px; }
  .jp-trade-hero__media { height:auto; min-height:380px; aspect-ratio:1.45/1; }

  .jp-ranges__inner,
  .jp-trade-benefits__inner,
  .jp-trade-gallery__inner { padding-left:28px; padding-right:28px; }
  .jp-ranges__grid { grid-template-columns:1fr 1fr; gap:28px 18px; }
  .jp-range-card { padding-right:0; }
  .jp-range-card:nth-child(odd) { padding-right:18px; border-right:1px solid var(--jp-line); }
  .jp-range-card:not(:last-child)::after { display:none; }
  .jp-range-card img { height:auto; aspect-ratio:1.12/1; }
  .jp-range-card p { min-height:0; }

  .jp-trade-benefits__top { grid-template-columns:1fr; gap:12px; }
  .jp-trade-benefits__top p { padding-top:0; }
  .jp-trade-benefits__grid { grid-template-columns:1fr 1fr; row-gap:30px; }
  .jp-trade-benefits__grid article:nth-child(2) { border-right:0; }

  .jp-trade-gallery__heading { grid-template-columns:1fr; gap:10px; }
  .jp-trade-gallery__grid { grid-template-columns:1fr 1fr; height:auto; }
  .jp-gallery-tall { aspect-ratio:4/5; }
  .jp-gallery-stack { min-height:0; }
  .jp-gallery-stack figure { aspect-ratio:16/10; }

  .jp-trade-cta__grid { grid-template-columns:1fr; gap:22px; min-height:0; padding:42px 34px; }
}

@media (max-width:520px) {
  .jp-trade-hero__copy { padding:40px 23px 36px; }
  .jp-trade-hero__copy h1 { font-size:45px; }
  .jp-trade-hero__copy .jp-button { width:100%; max-width:290px; }
  .jp-trade-hero__media { min-height:330px; aspect-ratio:auto; }

  .jp-ranges__inner,
  .jp-trade-benefits__inner,
  .jp-trade-gallery__inner { padding:38px 20px; }
  .jp-section-intro h2,
  .jp-trade-gallery__heading h2 { font-size:36px; }
  .jp-section-intro p,
  .jp-trade-gallery__heading p { font-size:14px; }
  .jp-ranges__grid { grid-template-columns:1fr; gap:30px; }
  .jp-range-card,
  .jp-range-card:nth-child(odd) { padding-right:0; border-right:0; }
  .jp-range-card img { aspect-ratio:1.35/1; }
  .jp-range-card h3 { font-size:25px; }
  .jp-range-card p { font-size:14px; }
  .jp-range-card a { font-size:10px; }

  .jp-trade-benefits__top h2 { font-size:35px; }
  .jp-trade-benefits__top p { font-size:14px; }
  .jp-trade-benefits__grid { grid-template-columns:1fr; gap:0; }
  .jp-trade-benefits__grid article { border-right:0; border-bottom:1px solid rgba(216,181,109,.26); padding:24px 0; }
  .jp-trade-benefits__grid article:last-child { border-bottom:0; }
  .jp-trade-benefits h3 { font-size:11px; }
  .jp-trade-benefits__grid p { font-size:13.5px; }

  .jp-trade-gallery__grid { grid-template-columns:1fr; }
  .jp-gallery-tall { aspect-ratio:4/5; }

  .jp-trade-cta__grid { padding:40px 23px; }
  .jp-trade-cta h2 { font-size:35px; }
  .jp-trade-cta__copy p { font-size:14px; }
}

/* =========================================================
   How It Works — approved design implementation v2.0.5
   Built inside the same 1024px global site frame as Home and
   Restaurants & Pubs. No alternate page scaling.
   ========================================================= */
.jp-how-page { background:#f7f4ef; }
.jp-how-page .jp-site-frame { width:min(100%, var(--jp-frame)); }

/* Hero */
.jp-how-hero { background:#f4efe9; }
.jp-how-hero__grid {
  display:grid;
  grid-template-columns:42% 58%;
  height:430px;
  overflow:hidden;
}
.jp-how-hero__copy {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  padding:36px 34px 31px 53px;
  background:linear-gradient(90deg,#f7f3ee 0%,#f5f1eb 78%,#efede8 100%);
}
.jp-how-hero__copy .jp-eyebrow { margin-bottom:14px; }
.jp-how-hero__copy h1 {
  margin:0;
  color:var(--jp-ink-deep);
  font-size:53px;
  line-height:.98;
  letter-spacing:-.04em;
}
.jp-how-hero__copy .jp-gold-rule { width:42px; height:3px; margin:17px 0 18px; }
.jp-how-hero__lead {
  max-width:355px;
  margin:0 0 21px;
  color:#343a36;
  font-size:15px;
  line-height:1.48;
}
.jp-how-hero__copy .jp-button { min-width:204px; min-height:43px; padding-inline:24px; font-size:10.5px; }
.jp-how-hero__signoff {
  margin:14px 0 0;
  color:#637168;
  font-size:8px;
  font-weight:700;
  letter-spacing:.31em;
  text-transform:uppercase;
}
.jp-how-hero__media { position:relative; height:430px; overflow:hidden; background:#211b16; }
.jp-how-hero__media img { width:100%; height:100%; object-fit:cover; object-position:center; }

/* Four-step process */
.jp-how-process { background:#f8f5f0; }
.jp-how-process__inner { padding:33px 53px 35px; }
.jp-how-process__inner > .jp-gold-rule { width:35px; height:3px; margin:0 0 14px; }
.jp-how-process h2 { margin:0; color:var(--jp-ink-deep); font-size:45px; line-height:1; letter-spacing:-.04em; }
.jp-how-process__intro { margin:8px 0 0; color:#5a5d59; font-size:15px; line-height:1.45; }
.jp-how-process__grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  column-gap:24px;
  margin-top:23px;
}
.jp-how-card {
  position:relative;
  min-width:0;
  padding:0;
}
.jp-how-card:not(:last-child)::after {
  content:"";
  position:absolute;
  top:0;
  right:-12px;
  width:1px;
  height:100%;
  background:rgba(16,45,35,.13);
}
.jp-how-card__media {
  position:relative;
  width:100%;
  aspect-ratio:1.42 / 1;
  margin:0 0 11px;
  overflow:visible;
}
.jp-how-card__media img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.jp-how-step-number {
  position:absolute;
  z-index:2;
  left:-12px;
  top:-11px;
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:linear-gradient(135deg,#e2bf78,#c9943f);
  color:#17130e;
  font-family:var(--jp-serif);
  font-size:25px;
  line-height:1;
  box-shadow:0 2px 6px rgba(38,28,14,.12);
}
.jp-how-card h3 { margin:0 0 7px; color:var(--jp-ink-deep); font-size:22px; line-height:1.05; letter-spacing:-.035em; }
.jp-how-card p { margin:0; color:#565b56; font-size:13.5px; line-height:1.48; }

/* Value/support panel */
.jp-how-benefits { color:#fff; background:linear-gradient(135deg,#123d2c 0%,#0f3426 58%,#183e2e 100%); }
.jp-how-benefits__inner { padding:29px 53px 30px; }
.jp-how-benefits__inner > .jp-gold-rule { width:35px; height:3px; margin:0 0 13px; background:#d1a554; }
.jp-how-benefits h2 { margin:0; color:#fff; font-size:38px; line-height:1.03; letter-spacing:-.035em; }
.jp-how-benefits__lead { margin:7px 0 0; color:rgba(255,255,255,.95); font-size:15px; line-height:1.4; }
.jp-how-benefits__grid { display:grid; grid-template-columns:repeat(4,1fr); margin-top:24px; }
.jp-how-benefits__grid article { text-align:center; padding:0 19px; border-right:1px solid rgba(215,178,103,.42); }
.jp-how-benefits__grid article:last-child { border-right:0; }
.jp-how-benefits__icon {
  width:56px; height:56px; margin:0 auto 11px; display:grid; place-items:center;
  border:1.5px solid #d9ae59; border-radius:50%; color:#d9ae59;
}
.jp-how-benefits__icon svg { width:31px; height:31px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.jp-how-benefits__grid h3 { margin:0 0 7px; color:#fff; font-size:10px; font-weight:750; letter-spacing:.16em; line-height:1.25; text-transform:uppercase; }
.jp-how-benefits__grid p { margin:0; color:rgba(255,255,255,.87); font-size:13px; line-height:1.4; }

/* Ingredients */
.jp-how-ingredients { background:#f6f2ed; }
.jp-how-ingredients__grid { display:grid; grid-template-columns:49% 51%; min-height:310px; }
.jp-how-ingredients__media { padding:27px 14px 27px 53px; }
.jp-how-ingredients__media img { width:100%; height:256px; object-fit:cover; object-position:center; }
.jp-how-ingredients__copy { position:relative; display:flex; align-items:center; min-width:0; padding:26px 34px 25px 39px; overflow:hidden; }
.jp-how-ingredients__text { position:relative; z-index:2; width:66%; }
.jp-how-ingredients__copy .jp-gold-rule { width:35px; height:3px; margin:0 0 13px; }
.jp-how-ingredients h2 { margin:0; color:var(--jp-ink-deep); font-size:39px; line-height:1.02; letter-spacing:-.035em; }
.jp-how-ingredients__text p { margin:15px 0 17px; color:#535853; font-size:13.5px; line-height:1.48; }
.jp-how-ingredients__text .jp-button { min-width:193px; min-height:40px; padding-inline:22px; font-size:9.8px; }
.jp-how-ingredients__decor { position:absolute; z-index:1; right:9px; top:23px; width:150px; height:auto; mix-blend-mode:multiply; opacity:.96; }

/* Closing CTA */
.jp-how-cta { position:relative; overflow:hidden; color:#fff; background:#173a2b; }
.jp-how-cta::before {
  position:absolute; inset:0; content:"";
  background-image:linear-gradient(90deg,rgba(20,55,40,.20),rgba(20,55,40,.12)),url('assets/images/leaf-texture.jpg');
  background-size:cover; background-position:center; opacity:.90;
}
.jp-how-cta__grid { position:relative; z-index:1; min-height:178px; display:grid; grid-template-columns:49% 51%; align-items:center; padding:27px 53px; }
.jp-how-cta .jp-eyebrow { margin-bottom:7px; color:#d7b367; }
.jp-how-cta h2 { margin:0; color:#fff; font-size:34px; line-height:1.03; letter-spacing:-.03em; }
.jp-how-cta__action { padding-left:39px; }
.jp-how-cta__action p { max-width:390px; margin:0 0 14px; color:rgba(255,255,255,.91); font-size:13.5px; line-height:1.45; }
.jp-how-cta__action .jp-button { min-width:195px; min-height:40px; font-size:9.8px; }
.jp-how-cta__action small { display:block; margin-top:8px; color:#fff; font-size:7.5px; font-weight:700; letter-spacing:.19em; text-transform:uppercase; }

@media (max-width:880px) {
  .jp-how-hero__grid { grid-template-columns:1fr; height:auto; }
  .jp-how-hero__copy { padding:46px 34px 39px; }
  .jp-how-hero__copy h1 { font-size:clamp(48px,9vw,62px); }
  .jp-how-hero__lead { max-width:620px; font-size:16px; }
  .jp-how-hero__media { height:auto; aspect-ratio:530/385; }

  .jp-how-process__inner { padding:45px 32px 38px; }
  .jp-how-process__grid { grid-template-columns:1fr 1fr; gap:28px 22px; }
  .jp-how-card:not(:last-child)::after { display:none; }
  .jp-how-card h3 { font-size:24px; }
  .jp-how-card p { font-size:14px; }

  .jp-how-benefits__inner { padding:42px 32px 40px; }
  .jp-how-benefits__grid { grid-template-columns:1fr 1fr; gap:30px 0; }
  .jp-how-benefits__grid article:nth-child(2) { border-right:0; }
  .jp-how-benefits__grid article { padding:0 24px; }

  .jp-how-ingredients__grid { grid-template-columns:1fr; }
  .jp-how-ingredients__media { padding:32px 32px 0; }
  .jp-how-ingredients__media img { height:auto; aspect-ratio:384/234; }
  .jp-how-ingredients__copy { min-height:290px; padding:38px 32px 42px; }
  .jp-how-ingredients__text { width:68%; }
  .jp-how-ingredients__decor { right:28px; top:34px; width:155px; }

  .jp-how-cta__grid { grid-template-columns:1fr; gap:24px; min-height:0; padding:40px 32px 43px; }
  .jp-how-cta__action { padding-left:0; }
}

@media (max-width:520px) {
  .jp-how-hero__copy { padding:39px 23px 34px; }
  .jp-how-hero__copy h1 { font-size:47px; line-height:.96; }
  .jp-how-hero__copy .jp-button { width:100%; max-width:290px; }
  .jp-how-hero__media { min-height:340px; aspect-ratio:auto; }
  .jp-how-hero__media img { object-position:55% center; }

  .jp-how-process__inner { padding:39px 23px 34px; }
  .jp-how-process h2 { font-size:39px; }
  .jp-how-process__grid { grid-template-columns:1fr; gap:30px; }
  .jp-how-card { padding-bottom:28px; border-bottom:1px solid rgba(16,45,35,.13); }
  .jp-how-card:last-child { padding-bottom:0; border-bottom:0; }
  .jp-how-card__media { width:100%; }
  .jp-how-card h3 { font-size:27px; }
  .jp-how-card p { font-size:15px; }

  .jp-how-benefits__inner { padding:39px 23px 38px; }
  .jp-how-benefits h2 { font-size:36px; }
  .jp-how-benefits__lead { font-size:15px; }
  .jp-how-benefits__grid { grid-template-columns:1fr; gap:0; margin-top:22px; }
  .jp-how-benefits__grid article { padding:24px 0; border-right:0; border-bottom:1px solid rgba(215,178,103,.35); }
  .jp-how-benefits__grid article:last-child { border-bottom:0; }
  .jp-how-benefits__grid h3 { font-size:11px; }
  .jp-how-benefits__grid p { font-size:14px; }

  .jp-how-ingredients__media { padding:26px 23px 0; }
  .jp-how-ingredients__copy { min-height:360px; padding:33px 23px 38px; align-items:flex-start; }
  .jp-how-ingredients__text { width:100%; max-width:290px; }
  .jp-how-ingredients h2 { font-size:38px; }
  .jp-how-ingredients__text p { font-size:14.5px; }
  .jp-how-ingredients__decor { right:8px; bottom:16px; top:auto; width:125px; opacity:.55; }
  .jp-how-ingredients__text .jp-button { width:100%; max-width:290px; }

  .jp-how-cta__grid { padding:37px 23px 40px; }
  .jp-how-cta h2 { font-size:35px; }
  .jp-how-cta h2 br { display:none; }
  .jp-how-cta__action p { font-size:14.5px; }
  .jp-how-cta__action .jp-button { width:100%; max-width:290px; }
}

/* v2.0.10: interior hero images are deliberately clean.
   No fades, overlays, quotes, filters or decorative pseudo-elements.
   Homepage hero is intentionally untouched. */
.jp-trade-hero__media,
.jp-how-hero__media {
  background: transparent;
}
.jp-trade-hero__media::before,
.jp-trade-hero__media::after,
.jp-how-hero__media::before,
.jp-how-hero__media::after {
  content: none !important;
  display: none !important;
  background: none !important;
}
.jp-trade-hero__media img,
.jp-how-hero__media img {
  opacity: 1 !important;
  filter: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}
