/* Gutter town pages and the Belfast gutter hub (Oct 2026): the price block under the H1.
   .qw-price, .qw-from and .qw-big come from site.css; these match the window pages' window-form.css. */
.qw-terms { margin: 0 0 14px; font-size: 15px; line-height: 1.45; color: #0f1b2d; font-weight: 600; }
.qw-alt { margin: 4px 0 0; text-align: center; font-size: 15px; }
.qw-alt a { display: inline-block; padding: 11px 6px; color: #0e6fc4; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.qw-rate { display: flex; align-items: center; justify-content: center; gap: 6px; margin: 6px 0 0; font-size: 14px; color: #4a5a6e; text-align: center; }
.qw-rate .qw-star { width: 16px; height: 16px; flex: none; }

/* The gutter monster's leaf canvas (monsters.js) is 24px wider than the hero photo on each side,
   so on phones it poked 6px past the screen and the page could shift sideways. Clip it at the
   edge of the top section; clip (unlike hidden) doesn't make the section a scroll box. */
.page-mast { overflow-x: clip; }

/* Van side photo A in the empty column right of the H1 and price block (Oct 2026).
   .qw-top wraps the eyebrow, H1 and price block. It is a plain block with no padding, border or
   new formatting context, so margins collapse exactly as before and phones lay out as they did.
   The photo is absolutely placed, so it never changes the height of the top section (no shift). */
.qw-van-hero { display: none; }
@media (min-width: 901px) {
  .qw-top { position: relative; }
  .qw-van-hero {
    display: block; position: absolute; top: 0; right: 0; bottom: 0; margin: 0;
    width: clamp(180px, calc(100% - 700px), 420px);
    border-radius: 18px; overflow: hidden; background: #e8eef5;
    box-shadow: 0 10px 30px rgba(12, 40, 80, .12);
  }
  .qw-van-hero img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 60% 45%; }
}
/* .qw-price is now inside .qw-top, so carry over site.css's "pull the monster up under the card" rule. */
@media (max-width: 900px) {
  .qw-top + .qw-mast-peek { margin-top: -8px; }
}
/* The van photo already shows the green gutter monster, so the standalone peeking monster
   is hidden wherever the photo shows (gutter pages only; phones keep it). */
@media (min-width: 901px) {
  .qw-top ~ .qw-mast-peek { display: none; }
}
