/* jdtheme26 — home page block "來 JUST DOG 逛逛" (store visit), 2026-09-28.
   Operator: 「新增一個區塊使用這個色塊背景」 + two watercolour edge pictures (top / bottom), 「中間底色用#faf5e9」, a mock-up (text left, shop picture right).
   Markup = a Raw HTML element in the front page (row .jd-home-visit, WPBakery "stretch row"); every selector is .jd-visit-prefixed.
   BACKGROUND = three stacked parts inside .jd-visit__bg, which fills the whole stretched row:
     top picture (irregular upper edge, natural height) / middle band #faf5e9 that takes whatever height is left / bottom picture (irregular lower edge).
   The edges are never stretched vertically, so the block can be any height (3 lines of text on a desktop, a tall stack on a phone). */

/* BACKGROUND since 2026-09-29 (operator: 「將"visit just dog"區塊的不規則圖片背景改成以下這種樣式」): the block is a .paper-band
   (assets/css/paper-edge.css) — a full-width band in one colour whose upper and lower edge are wide waves drawn by an SVG filter.
   The three-part PICTURE background (jd-wash-cream-top / -bottom.webp + a colour band) is no longer used here; the FAQ page's closing block still uses it. */
.jd-home-visit .wpb_raw_code { margin-bottom: 0; }
.jd-visit.paper-band { --paper-color: #fcfaf7; }   /* operator 2026-09-30 (was the paper band's default #fbf5e9) */

.jd-visit__inner {
  position: relative;
  z-index: 1;
  --jd-visit-pt: clamp(64px, 7vw, 110px);
  --jd-visit-pb: clamp(60px, 6.5vw, 100px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);    /* operator 2026-09-28, 3rd pass 「縮小左側欄位寬度，讓右圖更大一點」 (history: 1fr 1fr → 1.35fr 1fr → this) */
  align-items: center;
  gap: clamp(24px, 3.5vw, 56px);
  padding-block: 0;                   /* the band (.paper-band) brings the vertical padding */
}

/* 2026-09-28 (later): the picture stays INSIDE the band again (operator 「改回上一版右側圖片沒有超過邊界的版本」). */

/* The heading is styled by the home page's title style sheet (assets/css/jd-home-title.css).
   Operator 2026-09-29: 「VISIT JUST DOG 也是仿照"Shop by Category"一樣改正，並且只在右側加上小圖示，"大安森林公園旁的寵物用品店"刪除左側的圖示」
   → in this block: the English line is straight (not tilted) and carries the small two-stroke icon on its right; the heading has no icon. */
body .jd-visit .jd-home-head .jd-home-title::before { content: none; }
.jd-visit .jd-home-head { --jd-home-eyebrow-color: #e2d4c8; }   /* operator 2026-09-30: the category band's colour (was the default #fea1ab) */
.jd-visit .jd-home-head .jd-home-eyebrow {
  transform: none;
  margin-left: 0;
}
.jd-visit .jd-home-head .jd-home-eyebrow::after {
  content: "";
  flex: none;
  width: 24px;
  height: 24px;
  margin-top: -8px;
  background: url("../img/jd-title-spark-2.webp") center / contain no-repeat;
  transform: none;
}
.jd-visit .jd-home-head { gap: 8px; }

.jd-visit__body {
  margin: 0 0 12px;                  /* two paragraphs since 2026-09-28 */
  color: var(--jd-ink-700, #5c4a3c);
  text-wrap: pretty;                 /* no single character left alone on the last line (browsers without it wrap as before) */
}
.jd-visit__body + .jd-visit__facts { margin-top: 20px; }
.jd-visit .jd-visit__facts {
  margin: 0 0 26px;
  padding: 0;
  list-style: none;
}
.jd-visit .jd-visit__facts li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 0 0 10px;
  padding: 0;
  color: var(--jd-ink-900, #3b2a1f);
}
.jd-visit .jd-visit__facts li::before { content: none; }
.jd-visit__facts svg {
  flex: none;
  width: 22px;
  height: 22px;
  margin-top: 2px;
  color: var(--jd-ink-900, #3b2a1f);
}

.jd-visit__cta {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 18px;
}
/* the two buttons are the theme's buttons (assets/css/jd-button.css): .jd-btn.jd-btn--butter (#fde794) and .jd-btn.jd-btn--white */

.jd-visit__art img {
  display: block;
  width: 100%;
  max-width: 680px;                  /* was 600px */
  height: auto;
  margin-inline: auto;
}

@media (max-width: 1279px) {
  /* narrower text column: slightly smaller buttons so that the two stay on one line */
  .jd-visit__cta { gap: 12px 14px; }
  .jd-visit__cta .jd-btn { --jd-btn-h: 48px; --jd-btn-px: 22px; --jd-btn-fs: 15px; }
}
@media (max-width: 1024px) {
  .jd-visit__inner { gap: 24px; }
}
@media (max-width: 768px) {
  .jd-visit__inner {
    grid-template-columns: minmax(0, 1fr);
  }
  .jd-visit__art { order: -1; }                       /* picture first, then the text */
  .jd-visit__inner { --jd-visit-pt: 64px; --jd-visit-pb: 60px; }
  .jd-visit__art img { max-width: 420px; }
  .jd-visit__cta { gap: 12px; }
  .jd-visit__cta .jd-btn { --jd-btn-h: 48px; --jd-btn-px: 24px; --jd-btn-fs: 15px; }
}
/* phones (operator 2026-09-29: 「手機版的 … jd-btn--white 要在同一排，可以把字縮小一點」): the two buttons stay on ONE line — smaller lettering and padding,
   no wrapping. Sizes follow the window's width so that they also fit at 320px. */
@media (max-width: 520px) {
  .jd-visit__cta { flex-wrap: nowrap; gap: 8px; }
  .jd-visit__cta .jd-btn {
    --jd-btn-h: 42px;
    --jd-btn-px: clamp(10px, 3.4vw, 16px);
    --jd-btn-fs: clamp(11.5px, 3.45vw, 14px);
    flex: 0 1 auto;
    min-width: 0;
    gap: .4em;
    letter-spacing: .03em;
  }
  .jd-visit__cta .jd-btn .jd-btn__icon svg { width: 1.1em; height: 1.1em; }
  .jd-visit .jd-visit__facts { margin-bottom: 22px; font-size: 14px; }
  .jd-visit .jd-visit__facts li { gap: 9px; margin-bottom: 8px; }
  .jd-visit__facts svg { width: 19px; height: 19px; }
}

/* Member-only block row (2026-09-29): the shortcode prints nothing for visitors who are not logged in — the empty row must not leave a gap. */
body .vc_row.jd-home-member-row:not(:has(.jd-member)) { display: none; }