.main-nav .is-current::after { right: 0; }

.horeca-hero {
  position: relative;
  overflow: hidden;
  padding: clamp(62px, 7vw, 112px) 0 clamp(78px, 8vw, 124px);
  background:
    radial-gradient(circle at 75% 22%, rgba(247,198,0,.24), transparent 25%),
    linear-gradient(180deg, #fffdf8 0%, #f5f0e5 100%);
}
.horeca-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(37,39,42,.032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(37,39,42,.032) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.5), transparent 88%);
}
.horeca-hero-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0,.88fr) minmax(520px,1.12fr);
  align-items: center;
  gap: clamp(46px, 6vw, 96px);
}
.breadcrumb {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 34px;
  color: #74706a;
  text-decoration: none;
  font-size: 13px;
  font-weight: 800;
}
.breadcrumb:hover { color: var(--ink); }
.horeca-copy .eyebrow { margin-bottom: 16px; }
.horeca-copy h1 {
  margin: 0;
  max-width: 780px;
  font-size: clamp(55px, 5.7vw, 94px);
  line-height: .91;
  letter-spacing: -.055em;
  font-weight: 900;
}
.horeca-copy h1::after {
  content: "";
  display: block;
  width: 90px;
  height: 9px;
  margin-top: 27px;
  border-radius: 999px;
  background: var(--yellow);
}
.horeca-lead {
  max-width: 680px;
  margin: 30px 0 34px;
  font-size: clamp(18px, 1.35vw, 22px);
  line-height: 1.58;
  color: #5b5d60;
}
.horeca-lead strong { color: var(--ink); }

.brand-stage {
  position: relative;
  min-height: 650px;
  isolation: isolate;
}
.stage-orbit {
  position: absolute;
  width: 390px;
  height: 390px;
  right: 5%;
  top: 16%;
  border-radius: 50%;
  background: var(--yellow);
  opacity: .9;
  z-index: -3;
}
.brand-tile {
  position: absolute;
  overflow: hidden;
  border-radius: 30px;
  box-shadow: 0 30px 80px rgba(28,27,24,.18);
}
.china-tile {
  width: 68%;
  height: 61%;
  left: 0;
  top: 2%;
  background: #090909;
  transform: rotate(-2.8deg);
}
.china-tile-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .96;
}
.china-tile::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.32));
}
.china-tile-logo {
  position: absolute;
  z-index: 2;
  width: 74%;
  left: 13%;
  top: 8%;
  filter: drop-shadow(0 15px 18px rgba(0,0,0,.32));
}
.china-tile-stat {
  position: absolute;
  z-index: 3;
  left: 7%;
  bottom: 7%;
  display: grid;
  min-width: 126px;
  padding: 13px 16px;
  border-radius: 16px;
  background: rgba(0,0,0,.72);
  border: 1px solid rgba(255,255,255,.12);
  color: white;
  backdrop-filter: blur(8px);
}
.china-tile-stat strong { font-size: 32px; line-height: 1; color: #f7c600; }
.china-tile-stat span { margin-top: 5px; font-size: 11px; font-weight: 800; color: rgba(255,255,255,.7); }
.china-tile-stat.stat-right { left: auto; right: 7%; }

.crumb-tile {
  width: 56%;
  min-height: 315px;
  right: 0;
  bottom: 3%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 42px 38px 36px;
  background: #fffdf8;
  transform: rotate(3deg);
}
.crumb-tile::after {
  content: "";
  position: absolute;
  width: 170px;
  height: 170px;
  right: -48px;
  top: -52px;
  border: 28px solid rgba(247,198,0,.85);
  border-radius: 50%;
}
.crumb-tile img { position: relative; z-index: 2; width: 88%; }
.crumb-tile p {
  position: relative;
  z-index: 2;
  max-width: 360px;
  margin: 23px 0 0;
  font-size: 14px;
  line-height: 1.48;
  color: #63666a;
  font-weight: 700;
}
.crumb-dot { position: absolute; z-index: 1; border-radius: 50%; background: rgba(247,198,0,.32); }
.dot-a { width: 23px; height: 23px; left: 10%; top: 14%; }
.dot-b { width: 11px; height: 11px; left: 16%; top: 24%; }
.dot-c { width: 32px; height: 32px; right: 17%; bottom: 15%; }

.brand-choice {
  padding: clamp(80px, 8vw, 132px) 0 clamp(90px, 9vw, 145px);
  background: #eee9dd;
}
.choice-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 480px);
  gap: 60px;
  align-items: end;
  margin-bottom: 42px;
}
.choice-heading .eyebrow { margin-bottom: 10px; }
.choice-heading h2 {
  margin: 0;
  max-width: 780px;
  font-size: clamp(42px, 4.8vw, 76px);
  line-height: .95;
  letter-spacing: -.05em;
}
.choice-note {
  margin: 0 0 4px;
  font-size: 16px;
  line-height: 1.62;
  color: #676a6e;
}
.choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 20px;
}
.choice-card {
  position: relative;
  min-height: 790px;
  overflow: hidden;
  border-radius: 32px;
  text-decoration: none;
  box-shadow: 0 20px 55px rgba(27,27,25,.12);
  isolation: isolate;
  transition: transform 260ms ease, box-shadow 260ms ease;
}
.choice-bg {
  position: absolute;
  z-index: -3;
  inset: -1%;
  width: 102%;
  height: 102%;
  object-fit: cover;
  transition: transform 330ms ease, filter 330ms ease;
}
.choice-overlay {
  position: absolute;
  z-index: -2;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.68));
  transition: background 300ms ease;
}
.choice-content {
  min-height: 790px;
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 34px;
  color: white;
}
.choice-kicker {
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .16em;
  color: rgba(255,255,255,.7);
}
.choice-kicker.dark { color: #6f7073; }
.choice-logo.china-logo {
  width: min(73%, 450px);
  margin: 36px auto 8px;
  filter: drop-shadow(0 12px 18px rgba(0,0,0,.28));
}
.choice-copy {
  max-width: 570px;
  margin: 28px 0 0;
  font-size: 18px;
  line-height: 1.55;
  color: rgba(255,255,255,.84);
}
.dark-copy { color: #55585b; }
.china-matrix {
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  gap: 10px;
  margin-top: 34px;
}
.matrix-block {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-content: flex-start;
  padding: 17px;
  border-radius: 18px;
  background: rgba(8,8,8,.66);
  border: 1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(8px);
}
.matrix-block span:not(.matrix-label) {
  display: inline-flex;
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.09);
  font-size: 11px;
  line-height: 1.2;
  color: rgba(255,255,255,.82);
}
.matrix-label {
  width: 100%;
  margin-bottom: 3px;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: #f7c600;
}
.choice-cta {
  margin-top: auto;
  width: max-content;
  min-height: 52px;
  display: inline-flex;
  align-items: center;
  gap: 14px;
  padding: 0 20px;
  border-radius: 999px;
  background: var(--yellow);
  color: #171719;
  font-size: 13px;
  font-weight: 900;
}
.choice-cta span { font-size: 17px; }

.crumb-card {
  background: linear-gradient(145deg, #fffdf8 0%, #f4efe3 58%, #eee5cd 100%);
}
.crumb-card::before {
  content: "";
  position: absolute;
  z-index: -2;
  width: 520px;
  height: 520px;
  right: -150px;
  top: -145px;
  border: 74px solid rgba(247,198,0,.88);
  border-radius: 50%;
}
.crumb-card::after {
  content: "";
  position: absolute;
  z-index: -2;
  width: 240px;
  height: 240px;
  left: -90px;
  bottom: 84px;
  background: rgba(247,198,0,.14);
  border-radius: 50%;
}
.crumb-content { color: var(--ink); }
.crumb-logo-panel {
  position: relative;
  width: 91%;
  margin: 88px 0 20px;
  padding: 18px 20px;
  border-radius: 22px;
  background: rgba(255,255,255,.74);
  border: 1px solid rgba(37,39,42,.07);
  backdrop-filter: blur(8px);
}
.choice-logo.crumb-logo { width: 100%; }
.crumb-statement {
  position: relative;
  max-width: 510px;
  margin-top: 44px;
  padding: 22px 22px 22px 28px;
  border-radius: 20px;
  background: rgba(255,255,255,.7);
  border: 1px solid rgba(37,39,42,.07);
}
.crumb-statement p {
  margin: 0;
  font-size: 14px;
  line-height: 1.52;
  color: #66696c;
  font-weight: 750;
}
.crumb-accent {
  position: absolute;
  width: 5px;
  left: 12px;
  top: 18px;
  bottom: 18px;
  border-radius: 999px;
  background: var(--yellow);
}
.dark-cta { background: var(--ink); color: white; }
.crumb-pattern span {
  position: absolute;
  z-index: -1;
  border-radius: 50%;
  background: rgba(247,198,0,.23);
}
.crumb-pattern span:nth-child(1) { width: 18px; height: 18px; left: 10%; top: 18%; }
.crumb-pattern span:nth-child(2) { width: 7px; height: 7px; left: 14%; top: 24%; }
.crumb-pattern span:nth-child(3) { width: 29px; height: 29px; left: 19%; top: 12%; }
.crumb-pattern span:nth-child(4) { width: 13px; height: 13px; right: 17%; bottom: 19%; }
.crumb-pattern span:nth-child(5) { width: 31px; height: 31px; right: 11%; bottom: 11%; }
.crumb-pattern span:nth-child(6) { width: 8px; height: 8px; right: 24%; bottom: 9%; }

.horeca-contact {
  padding: 0 0 94px;
  background: #eee9dd;
}
.contact-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  padding: clamp(34px, 5vw, 64px);
  border-radius: 30px;
  background: var(--yellow);
}
.contact-panel .eyebrow { color: rgba(37,39,42,.6); margin-bottom: 10px; }
.contact-panel h2 {
  margin: 0;
  max-width: 790px;
  font-size: clamp(37px, 4.5vw, 68px);
  line-height: .95;
  letter-spacing: -.05em;
}
.contact-panel .button-primary { flex: 0 0 auto; }

@media (hover: hover) and (pointer: fine) {
  .choice-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 30px 70px rgba(27,27,25,.18);
  }
  .china-card:hover .choice-bg { transform: scale(1.018); filter: brightness(1.06); }
  .china-card:hover .choice-overlay { background: linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.58)); }
  .crumb-card:hover { background: linear-gradient(145deg, #fffefb 0%, #f7f1df 58%, #f1e5c5 100%); }
}

@media (max-width: 1180px) {
  .horeca-hero-grid { grid-template-columns: 1fr 1fr; gap: 42px; }
  .brand-stage { min-height: 570px; }
  .choice-grid { grid-template-columns: 1fr; }
  .choice-card, .choice-content { min-height: 720px; }
  .choice-logo.china-logo { width: min(58%, 430px); margin-left: 0; }
  .china-matrix { max-width: 760px; }
  .crumb-logo-panel { width: min(72%, 650px); }
}

@media (max-width: 860px) {
  .horeca-hero-grid { grid-template-columns: 1fr; }
  .brand-stage { min-height: 610px; max-width: 680px; width: 100%; margin: 0 auto; }
  .choice-heading { grid-template-columns: 1fr; gap: 20px; }
  .choice-note { max-width: 620px; }
}

@media (max-width: 620px) {
  .horeca-hero { padding: 44px 0 74px; }
  .breadcrumb { margin-bottom: 27px; }
  .horeca-copy h1 { font-size: clamp(50px, 15.2vw, 72px); }
  .horeca-lead { font-size: 17px; }
  .brand-stage { min-height: 500px; }
  .china-tile { width: 76%; height: 54%; }
  .crumb-tile { width: 65%; min-height: 255px; padding: 30px 24px 26px; }
  .china-tile-stat { min-width: 103px; padding: 10px 12px; }
  .china-tile-stat strong { font-size: 26px; }
  .china-tile-stat span { font-size: 9px; }
  .stage-orbit { width: 290px; height: 290px; right: 0; top: 18%; }

  .brand-choice { padding-top: 72px; }
  .choice-heading { margin-bottom: 28px; }
  .choice-card, .choice-content { min-height: 720px; }
  .choice-card { border-radius: 24px; }
  .choice-content { padding: 24px; }
  .choice-logo.china-logo { width: 80%; margin: 30px auto 0; }
  .choice-copy { font-size: 16px; }
  .china-matrix { grid-template-columns: 1fr; margin-top: 24px; }
  .matrix-block.sauces { display: none; }
  .crumb-logo-panel { width: 100%; margin-top: 96px; padding: 13px 14px; }
  .crumb-statement { margin-top: 28px; }

  .horeca-contact { padding-bottom: 72px; }
  .contact-panel { display: block; padding: 30px 24px; border-radius: 24px; }
  .contact-panel .button { margin-top: 28px; }
}