/* Hub venue asks (Build Train 2, lane C2, 24 Oct 2026). Printed by scripts/publish-hub-venue-asks.cjs on configured,
   non-held hub and list pages, in the HTML before first paint, so nothing moves after load:
   1. a.pg-hub-ask, one small "Ask about <venue> on WhatsApp" link at the foot of each venue card;
   2. aside.pg-hub-strip, the city-named name + WhatsApp strip after the hero (only where the page has no early ask),
      with "Prefer WhatsApp? Message us" under its fields, as the runtime strip it replaces has.
   House tokens (DESIGN.md): ink #362731, muted #705866, rule #dfd0da, ground #f6eff3, action #75435f / #592d46;
   WhatsApp green #167c43 as on the venue hero button. Manrope, 16px fields, 44-48px targets. No transforms, no
   animation, no will-change. The house stylesheets restyle links and form controls at (0,2,3) with !important,
   so these rules carry `html body` and !important where they must win. */

/* 1. The card ask: a block-level link on its own line, as wide as its words, under the card's own CTA. */
html body a.pg-hub-ask {
  box-sizing: border-box; display: flex !important; align-items: center; gap: 8px; align-self: flex-start;
  width: fit-content; max-width: 100%; min-height: 44px; margin: 10px 0 0 !important; padding: 0 !important;
  background: none !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  font: 600 14px/1.35 Manrope, Arial, sans-serif !important; letter-spacing: 0 !important; text-transform: none !important;
  text-align: left !important; color: #167c43 !important; text-decoration: underline !important;
  text-decoration-thickness: 1px; text-underline-offset: 3px; overflow-wrap: anywhere; white-space: normal;
}
html body a.pg-hub-ask::before, html body .pg-hub-strip a.pg-hub-strip__wa::before {
  content: ""; flex: 0 0 16px; width: 16px; height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23167c43' d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}
html body a.pg-hub-ask:hover { color: #11683a !important; }
html body a.pg-hub-ask:focus-visible { outline: 2px solid #75435f; outline-offset: 3px; }
/* In the Kerala hub's compact rows the link takes its own line under the description. */
html body .venue-row > a.pg-hub-ask { flex-basis: 100%; margin-top: 2px !important; min-height: 40px; }

/* 2. The city strip: a quiet card with two fields; on wide screens name, WhatsApp and the button share one row. */
html body aside.pg-hub-strip {
  box-sizing: border-box; display: block; width: 100%; max-width: 1080px; margin: 24px auto 28px; padding: 0 16px;
  font-family: Manrope, Arial, sans-serif; color: #362731; text-align: left;
  /* The field row follows the strip's own width. On the city hubs the strip lands in the venue grid's empty 372px rail
     beside the hero (.vr-page #main "hero rail"); width 100% keeps it the cell's width there, centred up to 1080px elsewhere. */
  container-type: inline-size;
}
/* Inside the money pages' and brand lists' content column the wrap already gives the page gutters. */
html body :is(.mp-wrap, .fs-wrap) > aside.pg-hub-strip { padding-inline: 0; }
html body .pg-hub-strip *, html body .pg-hub-strip *::before, html body .pg-hub-strip *::after { box-sizing: border-box; }
html body .pg-hub-strip form.pg-hub-strip__form {
  display: block; margin: 0 !important; padding: 18px 16px 14px !important; max-width: none; background: #f6eff3 !important;
  border: 1px solid #dfd0da !important; border-radius: 4px !important; box-shadow: none !important;
}
html body .pg-hub-strip .pg-hub-strip__title {
  margin: 0 0 6px !important; padding: 0; max-width: 46ch; font: 600 19px/1.35 Manrope, Arial, sans-serif !important;
  color: #362731 !important; letter-spacing: 0 !important; text-transform: none !important;
}
html body .pg-hub-strip .pg-hub-strip__line {
  margin: 0 0 14px !important; padding: 0; max-width: 66ch; font: 400 15px/1.6 Manrope, Arial, sans-serif !important; color: #705866 !important;
}
html body .pg-hub-strip .pg-hub-strip__fields { display: grid; grid-template-columns: 1fr; gap: 10px; align-items: end; margin: 0; }
html body .pg-hub-strip label.pg-hub-strip__field {
  display: flex; flex-direction: column; gap: 6px; min-width: 0; margin: 0 !important;
  font: 600 13px/1.4 Manrope, Arial, sans-serif !important; color: #362731 !important; letter-spacing: 0 !important; text-transform: none !important;
}
html body .pg-hub-strip .pg-hub-strip__field input {
  display: block; width: 100% !important; min-height: 48px; margin: 0 !important; padding: 11px 12px !important;
  font: 400 16px/1.5 Manrope, Arial, sans-serif !important; color: #362731 !important; background: #fff !important;
  border: 1px solid #dfd0da !important; border-radius: 4px !important; box-shadow: none !important;
}
html body .pg-hub-strip .pg-hub-strip__field input::placeholder { color: #8a7382; opacity: 1; }
html body .pg-hub-strip .pg-hub-strip__field input:focus-visible { outline: 2px solid #75435f; outline-offset: 2px; border-color: #75435f !important; }
html body .pg-hub-strip .pg-hub-strip__field input[aria-invalid="true"] { border-color: #9c263b !important; }
html body .pg-hub-strip button.pg-hub-strip__button {
  display: flex; align-items: center; justify-content: center; width: 100%; min-height: 48px; margin: 0 !important;
  padding: 12px 22px !important; background: #75435f !important; color: #fff !important; border: 1px solid #75435f !important;
  border-radius: 4px !important; font: 600 15px/1.4 Manrope, Arial, sans-serif !important; letter-spacing: 0 !important;
  text-transform: none !important; cursor: pointer; box-shadow: none !important;
}
html body .pg-hub-strip button.pg-hub-strip__button:hover { background: #592d46 !important; border-color: #592d46 !important; }
html body .pg-hub-strip button.pg-hub-strip__button:focus-visible { outline: 2px solid #592d46; outline-offset: 3px; }
html body .pg-hub-strip button.pg-hub-strip__button:disabled { opacity: .7; cursor: wait; }
/* The WhatsApp alternative under the fields: the runtime strip's words, the venue asks' green. */
html body .pg-hub-strip .pg-hub-strip__waline { margin: 10px 0 0 !important; padding: 0; font: 400 14px/1.5 Manrope, Arial, sans-serif !important; color: #362731 !important; }
/* Keyed on the form's id: inside a hero, house-system.css colours every link at specificity (0,6,2). */
html body #hub-city-strip a.pg-hub-strip__wa {
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px; vertical-align: middle; padding: 0 !important; background: none !important;
  border: 0 !important; box-shadow: none !important; font: 600 14px/1.35 Manrope, Arial, sans-serif !important; letter-spacing: 0 !important;
  text-transform: none !important; color: #167c43 !important; text-decoration: underline !important; text-underline-offset: 3px;
}
html body #hub-city-strip a.pg-hub-strip__wa:hover { color: #11683a !important; }
html body #hub-city-strip a.pg-hub-strip__wa:focus-visible { outline: 2px solid #75435f; outline-offset: 3px; }
html body .pg-hub-strip .pg-hub-strip__status { margin: 10px 0 0 !important; font: 400 14px/1.6 Manrope, Arial, sans-serif !important; color: #362731 !important; }
html body .pg-hub-strip .pg-hub-strip__status:empty { display: none; }
html body .pg-hub-strip .pg-hub-strip__status[data-state="success"] { font-weight: 600 !important; }
html body .pg-hub-strip .pg-hub-strip__status a { color: #75435f !important; text-decoration: underline !important; }
html body .pg-hub-strip .pg-hub-strip__small { margin: 10px 0 0 !important; font: 400 12px/1.6 Manrope, Arial, sans-serif !important; color: #705866 !important; }
html body .pg-hub-strip .pg-hub-strip__small a { color: #75435f !important; text-decoration: underline !important; text-underline-offset: 3px; }
/* Name, WhatsApp and the button share one row only where the strip itself is wide enough; in a narrow rail or on a
   phone they stack. Browsers without container queries keep the stacked layout. */
@container (min-width: 600px) {
  html body .pg-hub-strip form.pg-hub-strip__form { padding: 22px 26px 16px !important; }
  html body .pg-hub-strip .pg-hub-strip__fields { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: 12px; }
  html body .pg-hub-strip button.pg-hub-strip__button { width: auto; }
}
@media print { html body aside.pg-hub-strip, html body a.pg-hub-ask { display: none !important; } }
