/* ============================================================
   mig-warmhost.css — "Warm Host" design layer (WARMHOST-PLAN)
   ADDITIVE. Loads only when Site Settings → Appearance →
   "Warm Host theme" is ON. Every rule scoped under body.mig-warm.
   Never edit theme.css / tokens.css.
   ------------------------------------------------------------
   PHASE 1 — global foundation + warm component kit + the surfaces
   used for the tuning checkpoint (home, itineraries, blog, reviews).
   Later phases REUSE the kit tokens below — do not improvise values.
   ============================================================ */

/* === WARM COMPONENT KIT (reuse these everywhere) ===========
   Radii   : --wh-r (cards/photos 12px) · --wh-r-sm (10px) · --wh-r-btn (8px)
   Shadows : --wh-shadow (lifted/hover) · --wh-shadow-sm (resting)
   Patterns: warm card    = cream bg + 1px warm border + radius --wh-r + --wh-shadow-sm
             hover-lift    = translateY(-4px) + --wh-shadow  (transform only — no layout shift)
             tag-pill      = terracotta tint + pill radius
             content photo = radius --wh-r  (NEVER gallery/.mig-photo/hero/lightbox — see GUARDS)
   ============================================================ */
body.mig-warm {
  /* warmer ground tokens — cascade through the theme */
  --mh-sand:   #F3EDE1;
  --mh-sand-2: #EBE2D0;
  --mh-cream:  #FDFBF6;
  /* kit */
  --wh-r:     12px;
  --wh-r-sm:  10px;
  --wh-r-btn:  8px;
  --wh-bd:    rgba(140,72,48,.14);
  --wh-shadow:    0 20px 44px -18px rgba(140,72,48,.30), 0 4px 12px -5px rgba(26,43,76,.12);
  --wh-shadow-sm: 0 8px 20px -12px rgba(140,72,48,.26);
  background: var(--mh-sand);
}

/* === GLOBAL PRIMITIVES ===================================== */
body.mig-warm .btn { border-radius: var(--wh-r-btn); }
body.mig-warm .rule-accent { border-radius: 2px; }
body.mig-warm .card { border-radius: var(--wh-r); border-color: var(--wh-bd); box-shadow: var(--wh-shadow-sm); }
body.mig-warm .card:hover { box-shadow: var(--wh-shadow); }
body.mig-warm .input,
body.mig-warm input[type="text"],
body.mig-warm input[type="email"],
body.mig-warm input[type="search"],
body.mig-warm textarea { border-radius: var(--wh-r-sm); }
body.mig-warm ::selection { background: var(--mh-terracotta); color: #fff; }

/* ── Blog sidebar subscribe form (Jetpack). The form was invisible during the
   build (Jetpack offline on Local), so it never got styled and ships with
   Jetpack's defaults (cramped input, oversized pill button, wrong font/colour).
   Mirror the contact-form Warm Host styling. Added 2026-06-14. ── */
body.mig-warm .mig-cat-sidebar__subscribe #subscribe-email { margin: 0 0 10px; }
body.mig-warm .mig-cat-sidebar__subscribe #subscribe-submit { margin: 0; }
body.mig-warm .mig-cat-sidebar__subscribe input[type="email"] {
  font-family: var(--font-body) !important;
  font-size: var(--t-body) !important;
  color: var(--mh-ink) !important;
  background: var(--mh-cream) !important;
  border: 1px solid var(--mh-rule-strong) !important;
  border-radius: var(--wh-r-sm) !important;
  padding: 0.7rem 0.9rem !important;
  width: 100% !important;
  box-sizing: border-box !important;
  box-shadow: none !important;
}
body.mig-warm .mig-cat-sidebar__subscribe input[type="email"]::placeholder { color: var(--mh-ink-2); opacity: 1; }
body.mig-warm .mig-cat-sidebar__subscribe input[type="email"]:focus {
  outline: none !important;
  border-color: var(--mh-navy) !important;
  box-shadow: 0 0 0 3px rgba(26,43,76,0.12) !important;
}
body.mig-warm .mig-cat-sidebar__subscribe .wp-block-button__link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  font-family: var(--font-body) !important;
  font-size: var(--t-caption) !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: var(--tracking-wider) !important;
  color: var(--mh-cream) !important;
  background: var(--accent) !important;
  border: 1.5px solid transparent !important;
  border-radius: var(--wh-r-btn) !important;
  padding: 0.7rem 1.5rem !important;
  margin: 0 !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: background var(--dur-fast) var(--ease-out-expo) !important;
}
body.mig-warm .mig-cat-sidebar__subscribe .wp-block-button__link:hover { background: var(--accent-press) !important; }

/* === SQUARE GUARDS (design + functional — NEVER round these) === */
body.mig-warm .mh-hero__media,
body.mig-warm .mh-hero__poster-mobile,
body.mig-warm .mig-photo,
body.mig-warm .mig-photo > img,
body.mig-warm .mig-gallery img,
body.mig-warm .mig-lightbox img,
body.mig-warm .mig-blog-lightbox img { border-radius: 0 !important; }

/* === REUSABLE WARM CARD (main card components across the site) === */
body.mig-warm .mh-exp-card,
body.mig-warm .mig-itin-card,
body.mig-warm .mig-review-card,
body.mig-warm .mig-post-card {
  background: var(--mh-cream);
  border: 1px solid var(--wh-bd);
  border-radius: var(--wh-r);
  box-shadow: var(--wh-shadow-sm);
  transition: transform .25s ease, box-shadow .25s ease;
}
body.mig-warm .mh-exp-card:hover,
body.mig-warm .mig-itin-card:hover,
body.mig-warm .mig-review-card:hover,
body.mig-warm .mig-post-card:hover,
body.mig-warm .mig-post-card--featured:hover,
body.mig-warm .mh-journal__entry:hover { /* QA9-R9 (Samuel): home journal cards + the blog featured card were the one family without the lift */
  transform: translateY(-4px);
  box-shadow: var(--wh-shadow);
}
body.mig-warm .mh-journal__entry,
body.mig-warm .mig-post-card--featured {
  transition: transform .25s ease, box-shadow .25s ease;
}

/* image-on-top cards (homepage experiences, itineraries) — round TOP corners */
body.mig-warm .mh-exp-card__photo,
body.mig-warm .mig-itin-card .mig-itin-card__cover,
body.mig-warm .mig-itin-card img { border-radius: var(--wh-r) var(--wh-r) 0 0; }

/* blog images are horizontal (list) or standalone (featured) — round ALL corners
   (fixes: list thumbs square on the bottom; the featured image not rounding at all) */
body.mig-warm .mig-post-card img,
body.mig-warm .mig-post-card--featured img { border-radius: var(--wh-r); }

/* tag pills */
body.mig-warm .mh-exp-card__tag,
body.mig-warm .mig-itin-card__theme {
  background: rgba(200,106,76,.12);
  color: var(--mh-terracotta-2);
  padding: 4px 11px;
  border-radius: 999px;
  font-weight: 600;
}

/* === HOMEPAGE (the approved reference look) ================ */
body.mig-warm .mh-about__photo-col .mh-photo-block,
body.mig-warm .mh-about__photo-col img { border-radius: var(--wh-r); overflow: hidden; box-shadow: var(--wh-shadow); }
body.mig-warm .mh-home-guests__num,
body.mig-warm .mh-home-guests__row-arrow { color: var(--mh-terracotta); }
body.mig-warm .mh-home-guests__row.is-active { background: rgba(200,106,76,.07); border-radius: var(--wh-r-sm); }
/* The preview card already has overflow:hidden, so it clips the full-bleed image
   to its own corners. Rounding the image to 12px while the card only clipped at
   --radius-md (4px) left cream card corners poking out above the image. Round the
   CARD to the warm radius and let it do the clipping; the image stays square. */
body.mig-warm .mh-home-guests__preview-card { border-radius: var(--wh-r); }
body.mig-warm .mh-home-guests__preview-img-wrap,
body.mig-warm .mh-home-guests__preview-img { border-radius: 0; }
body.mig-warm .mh-insta__tile { border-radius: var(--wh-r-sm); overflow: hidden; }
/* the FAQ list had a top divider rule for the old row layout; remove it now that items are boxed cards */
body.mig-warm .mh-faq__list,
body.mig-warm .mig-itin-faq .mh-faq__list { border-top: 0; }
body.mig-warm .mh-faq__item { background: var(--mh-cream); border: 1px solid var(--wh-bd); border-radius: var(--wh-r-sm); margin-bottom: 10px; padding: 2px 18px; }
body.mig-warm .mh-faq__toggle { color: var(--mh-terracotta); }
/* homepage Field Journal — small teaser image, kept compact so it barely adds scroll */
body.mig-warm .mh-journal__thumb { display: block; margin-bottom: 14px; border-radius: var(--wh-r-sm); overflow: hidden; height: 120px; }
body.mig-warm .mh-journal__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 767px) { body.mig-warm .mh-journal__thumb { height: 150px; } }
/* Philosophy + Contact CTA: intentionally LEFT NAVY (Samuel's call) — no overrides. */

/* === REVIEWS (testimonials) =============================== */
body.mig-warm .mig-review-card__quote { color: var(--mh-navy); }
body.mig-warm .mig-review-card__more,
body.mig-warm .mig-review-card__source-link { color: var(--mh-terracotta); }

/* === BLOG ================================================= */
body.mig-warm .mig-post-card__byline,
body.mig-warm .mig-article-byline__name { color: var(--mh-navy); }
body.mig-warm .mig-article-byline__avatar img { border-radius: 50%; }

/* === HEADER / FOOTER (global chrome — light touch) ======== */
body.mig-warm .mig-nav__divider { background: var(--wh-bd); }
/* nav search: the input is a borderless field inside a pill container. Our generic
   input radius + focus-ring made a nested double-border — restore the input to plain
   and put the warm focus affordance on the pill instead. */
body.mig-warm .mig-nav__search-input { border-radius: 0; }
body.mig-warm .mig-nav__search-input:focus-visible { outline: 0; outline-offset: 0; }
body.mig-warm .mig-nav__search-form:focus-within { border-color: var(--mh-terracotta); }
/* Footer stays navy (anchor) — leave as-is. */

/* === ACCESSIBILITY ======================================== */
body.mig-warm a:focus-visible,
body.mig-warm .btn:focus-visible,
body.mig-warm button:focus-visible,
body.mig-warm input:focus-visible,
body.mig-warm summary:focus-visible { outline: 2px solid var(--mh-terracotta); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  body.mig-warm .mh-exp-card,
  body.mig-warm .mig-itin-card,
  body.mig-warm .mig-review-card,
  body.mig-warm .mig-post-card,
  body.mig-warm .mig-post-card--featured,
  body.mig-warm .mh-journal__entry { transition: none; }
  body.mig-warm .mh-exp-card:hover,
  body.mig-warm .mig-itin-card:hover,
  body.mig-warm .mig-review-card:hover,
  body.mig-warm .mig-post-card:hover,
  body.mig-warm .mig-post-card--featured:hover,
  body.mig-warm .mh-journal__entry:hover { transform: none; }
}


/* === ITINERARIES (Phase 3 · G1) ===========================
   Archive chip refinements + single-itinerary (was unstyled).
   Reuses kit vars only. Hero photo kept SQUARE; CTA band kept NAVY.
   Filter-BAR surface left as today's flat sand by default (lighter
   touch — only chips warmed; inset-card option held for Samuel). */
body.mig-warm .mig-filter-pill { border-color: var(--wh-bd); border-width: 1px; background: rgba(200,106,76,.07); color: var(--mh-terracotta-2); min-height: 36px; }
body.mig-warm .mig-filter-pill:hover { background: rgba(200,106,76,.14); border-color: var(--mh-terracotta); }
body.mig-warm .mig-filter-pill.is-active { border-width: 1px; }
/* drop the redundant divider above the filter rows (it doubles with the hero underline) */
body.mig-warm .mig-itin-filters__row { border-top: 0; }
/* tighten: chips sit closer to the header divider now the inner rule is gone (was 48px top) */
body.mig-warm .mig-itin-filters { padding-top: 20px; }
body.mig-warm .mig-page-hero__rule { background: var(--mh-terracotta); }
body.mig-warm .mig-itin-card .mh-photo-block { border-radius: var(--wh-r) var(--wh-r) 0 0; }
/* #TR2-B2 (Samuel 2026-06-09): the itinerary cover photo was deliberately kept SQUARE,
   but it's an inset column photo (not full-bleed gallery/hero/lightbox), so Samuel now wants
   it rounded like every other content photo. Rounds the cover img + the no-photo fallback. */
body.mig-warm .mig-itin-body__inner > div:first-of-type img,
body.mig-warm .mig-itin-body__inner > div:first-of-type .mh-photo-block { border-radius: var(--wh-r); }
body.mig-warm .mig-itin-partof a { color: var(--mh-terracotta-2); }
body.mig-warm .mig-itin-partof a:hover { border-bottom-color: var(--mh-terracotta); }
body.mig-warm .mig-itin-timeline::before { background: var(--wh-bd); }
body.mig-warm .mig-itin-timeline__dot { background: var(--mh-cream); }
body.mig-warm .mig-itin-timeline__region { color: var(--mh-terracotta-2); }
body.mig-warm .mig-itin-sites { background: var(--mh-cream); border: 1px solid var(--wh-bd); border-radius: var(--wh-r); box-shadow: var(--wh-shadow-sm); padding: clamp(20px,4vw,36px); }
body.mig-warm .mig-itin-sites__item { border-bottom-color: var(--wh-bd); }
body.mig-warm .mig-itin-sites__item:last-child { border-bottom-color: transparent; }
body.mig-warm .mig-itin-arrangement { border: 1px solid var(--wh-bd); border-radius: var(--wh-r); box-shadow: var(--wh-shadow-sm); }
body.mig-warm .mig-itin-arrangement__row { border-bottom-color: var(--wh-bd); }
body.mig-warm .mig-itin-arrangement__label { color: var(--mh-terracotta-2); }
body.mig-warm .mig-itin-relcard { background: var(--mh-cream); border: 1px solid var(--wh-bd); border-radius: var(--wh-r-sm); }
body.mig-warm .mig-itin-relcard:hover { border-color: var(--mh-terracotta); box-shadow: var(--wh-shadow-sm); }
body.mig-warm .mig-itin-relcard__kind { color: var(--mh-terracotta-2); }
body.mig-warm .mig-itin-body__inner img.mig-itin-relcard__thumb { border-radius: var(--wh-r-sm); }
@media (max-width: 767px) { body.mig-warm .mig-filter-pill { min-height: 44px; padding-top: 10px; padding-bottom: 10px; } }

/* === TESTIMONIALS + QUOTE COMPONENTS (Phase 3 · G2) =======
   Refines filter bar/pills, featured accent, card internals,
   read-more control, quote rotator dots, author card.
   (The .mig-review-card shell is already warmed earlier in this file.) */
body.mig-warm .mig-reviews-filter { background: var(--mh-sand); border-top: 1px solid var(--wh-bd); }
body.mig-warm .mig-reviews-filter__pill { border-color: var(--wh-bd); border-radius: var(--radius-pill); }
body.mig-warm .mig-reviews-filter__pill:hover { border-color: var(--mh-terracotta); background: var(--mh-cream); color: var(--mh-terracotta-2); }
body.mig-warm .mig-reviews-filter__pill.is-empty { border-color: var(--wh-bd); }
@media (max-width: 767px) { body.mig-warm .mig-reviews-filter__pill { min-height: 44px; } }
body.mig-warm .mig-review-card--featured { border-color: var(--wh-bd); box-shadow: var(--wh-shadow-sm); }
body.mig-warm .mig-review-card--featured::before { border-radius: var(--wh-r-btn); }
body.mig-warm .mig-review-card__name { color: var(--mh-navy); }
body.mig-warm .mig-review-card__tour { color: var(--mh-terracotta-2); }
body.mig-warm .mig-review-card__source-link { text-underline-offset: 2px; }
body.mig-warm .mig-review-card__source-link:hover { color: var(--mh-terracotta-2); }
body.mig-warm .mig-review-card__more { color: var(--mh-terracotta-2); border-bottom-color: rgba(200,106,76,.45); transition: color .15s ease, border-color .15s ease, opacity .15s ease; }
body.mig-warm .mig-review-card__more:hover,
body.mig-warm .mig-review-card__more:focus-visible { color: var(--mh-terracotta); border-bottom-color: var(--mh-terracotta); opacity: 1; }
@media (max-width: 767px) { body.mig-warm .mig-review-card__more { padding: 8px 2px; margin: -8px -2px 12px; min-height: 44px; display: inline-flex; align-items: center; } }
body.mig-warm .mh-rotator__dot::before { background: rgba(140,72,48,.22); }
body.mig-warm .mh-rotator__dot:hover::before { background: rgba(200,106,76,.45); }
body.mig-warm .mig-author-card { border-color: var(--wh-bd); border-left-color: var(--mh-terracotta); border-radius: var(--wh-r); box-shadow: var(--wh-shadow-sm); transition: transform .25s ease, box-shadow .25s ease; }
body.mig-warm .mig-author-card:hover { transform: translateY(-4px); box-shadow: var(--wh-shadow); }
body.mig-warm .mig-author-card__portrait img,
body.mig-warm .mig-author-card__monogram { border-radius: 50%; }
body.mig-warm .mig-author-card__eyebrow { color: var(--mh-terracotta-2); }
body.mig-warm .mig-author-card__name-link:hover,
body.mig-warm .mig-author-card__name-link:focus-visible { border-bottom-color: var(--mh-terracotta); }
@media (prefers-reduced-motion: reduce) { body.mig-warm .mig-author-card { transition: none; } body.mig-warm .mig-author-card:hover { transform: none; } }


/* === BLOG (Phase 4) ======================================
   Related cards, article header accent, search form/results.
   Content images stay square (watermarked .mig-photo guarded);
   TOC / panorama / lightbox left functional (not restyled). */
body.mig-warm .mig-related__card { background: var(--mh-cream); border: 1px solid var(--wh-bd); border-radius: var(--wh-r); box-shadow: var(--wh-shadow-sm); transition: transform .25s ease, box-shadow .25s ease; }
body.mig-warm .mig-related__card:hover { transform: translateY(-4px); box-shadow: var(--wh-shadow); }
body.mig-warm .mig-related__card img,
body.mig-warm .mig-related__card .mh-photo-block { border-radius: var(--wh-r) var(--wh-r) 0 0; }
/* equal media height across all cards (best practice — fixed ratio + cover) */
body.mig-warm .mig-related__card img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; display: block; }
/* inset the text from the card edges (image stays full-bleed) */
body.mig-warm .mig-related__card-cat { color: var(--mh-terracotta-2); padding: 16px 22px 0; }
body.mig-warm .mig-related__card-title { padding: 6px 22px 0; }
body.mig-warm .mig-related__card-mins { padding: 8px 22px 20px; }
body.mig-warm .mig-article-eyebrow { color: var(--mh-terracotta); }
body.mig-warm .mig-search__input { border-radius: var(--wh-r-sm); }
body.mig-warm .mig-search__submit { border-radius: var(--wh-r-btn); }
/* Search result cards: media is full-bleed and the card (overflow:hidden) clips
   it to the card's rounded corners, so the media itself must be square — the
   generic .mig-post-card img radius would otherwise leave cream notches where the
   image meets the text body. (SEARCH-UX-PLAN follow-up 2026-06-08) */
body.mig-warm .mig-search-card .mig-search-card__img,
body.mig-warm .mig-search-card .mig-search-card__fallback { border-radius: 0; }
body.mig-warm .mig-article-list__sort select { border-radius: var(--wh-r-sm); }
/* keep panorama images square (functional viewer) */
body.mig-warm .mig-pano__img-wrap img,
body.mig-warm .mig-pano__snap { border-radius: 0 !important; }
@media (prefers-reduced-motion: reduce) { body.mig-warm .mig-related__card { transition: none; } body.mig-warm .mig-related__card:hover { transform: none; } }


/* === BLOG author card -> navy 'meet the author' (Samuel's choice 2026-06-07) === */
body.mig-warm .mig-author-card { background: var(--mh-navy); border-color: rgba(253,251,247,.16); border-left-color: var(--mh-terracotta); box-shadow: 0 24px 54px -20px rgba(14,27,50,.55); }
body.mig-warm .mig-author-card__eyebrow { color: #E0916F; }
body.mig-warm .mig-author-card__name,
body.mig-warm .mig-author-card__name-link { color: var(--mh-cream); }
body.mig-warm .mig-author-card__role { color: rgba(253,251,247,.92); }
body.mig-warm .mig-author-card__credentials { color: rgba(253,251,247,.74); }
body.mig-warm .mig-author-card__bio { color: rgba(253,251,247,.9); }
body.mig-warm .mig-author-card__name-link:hover,
body.mig-warm .mig-author-card__name-link:focus-visible { border-bottom-color: var(--mh-terracotta); }
/* remove the now-redundant closing signature + its rule (the author card replaces it) */
body.mig-warm .mig-article-sig { display: none; }

/* === BLOG comments — leaner + collapsible form (Phase 4 follow-up) === */
body.mig-warm .mig-comments__form-details { margin-top: 18px; }
body.mig-warm .mig-comments__form-summary { display:inline-flex; align-items:center; gap:10px; cursor:pointer; list-style:none; font-family:Inter,system-ui,sans-serif; font-weight:600; letter-spacing:.08em; text-transform:uppercase; font-size:13px; color:var(--mh-navy); border:1.5px solid var(--mh-navy); border-radius:var(--wh-r-btn); padding:12px 22px; transition:background .2s ease,color .2s ease; }
body.mig-warm .mig-comments__form-summary::-webkit-details-marker { display:none; }
body.mig-warm .mig-comments__form-summary::marker { content:""; }
body.mig-warm .mig-comments__form-summary:hover { background:var(--mh-navy); color:var(--mh-cream); }
body.mig-warm .mig-comments__form-plus { position:relative; width:12px; height:12px; display:inline-block; }
body.mig-warm .mig-comments__form-plus::before,
body.mig-warm .mig-comments__form-plus::after { content:""; position:absolute; background:currentColor; transition:opacity .2s ease; }
body.mig-warm .mig-comments__form-plus::before { left:5px; top:0; width:2px; height:12px; }
body.mig-warm .mig-comments__form-plus::after { top:5px; left:0; width:12px; height:2px; }
body.mig-warm .mig-comments__form-details[open] .mig-comments__form-plus::before { opacity:0; }   /* + -> – when open */
body.mig-warm .mig-comments__form-details[open] .mig-comments__form-summary { margin-bottom:16px; }
/* tighter form */
body.mig-warm .mig-comments__form-details #respond { margin-top:0; }
body.mig-warm .comment-form { margin-top:4px; }
body.mig-warm .comment-form p { margin:0 0 12px; }
body.mig-warm #comment { min-height:84px; max-height:360px; field-sizing:content; border-radius:var(--wh-r-sm); resize:vertical; }
body.mig-warm .mig-comments__note { font-size:13px; margin-bottom:12px; }
@media (min-width:601px){
  body.mig-warm .comment-form-author, body.mig-warm .comment-form-email { display:inline-block; width:calc(50% - 8px); vertical-align:top; }
  body.mig-warm .comment-form-author { margin-right:12px; }
  body.mig-warm .comment-form-author input, body.mig-warm .comment-form-email input { width:100%; }
}

/* === BLOG comment list — now that comments render, warm-style them === */
body.mig-warm .comment-list { list-style:none; margin:10px 0 0; padding:0; }
body.mig-warm .comment-list .comment { margin:0 0 14px; }
body.mig-warm .comment-list .comment-body { background:var(--mh-cream); border:1px solid var(--wh-bd); border-radius:var(--wh-r); padding:16px 20px; box-shadow:var(--wh-shadow-sm); }
body.mig-warm .comment-list .children { list-style:none; margin:12px 0 0 26px; padding:0; }
body.mig-warm .comment-author img.avatar { border-radius:50%; }
body.mig-warm .comment-author .fn { color:var(--mh-navy); font-weight:600; font-style:normal; }
body.mig-warm .comment-meta, body.mig-warm .comment-metadata a { color:var(--mh-ink-2); font-size:13px; }
body.mig-warm .comment .reply a { color:var(--mh-terracotta); font-weight:600; font-size:13px; letter-spacing:.04em; }
/* highlight Samuel's own replies (post author) */
body.mig-warm .comment.bypostauthor > .comment-body { border-left:3px solid var(--mh-terracotta); background:rgba(200,106,76,.05); }

/* === comment section corrections (Samuel 2026-06-07) === */
/* 1) no divider lines between comments (the warm cards already separate them) */
body.mig-warm .mig-comments .comment-list .comment { border-bottom: 0; padding: 0; }
/* 2) drop the + icon on the "Leave a comment" button */
body.mig-warm .mig-comments__form-plus { display: none; }
/* 3) Akismet notice only shows when the form is expanded */
body.mig-warm .mig-comments__form-details:not([open]) ~ .akismet_comment_form_privacy_notice { display: none; }
/* 4) Name + Email on one line (desktop). Flex the form: textarea/submit full width, name+email half each */
@media (min-width: 601px) {
  body.mig-warm #commentform { display: grid; grid-template-columns: 1fr 1fr; column-gap: 16px; }
  body.mig-warm #commentform > * { grid-column: 1 / -1; margin-left: 0; margin-right: 0; }
  body.mig-warm #commentform > p.comment-form-author { grid-column: 1; }
  body.mig-warm #commentform > p.comment-form-email { grid-column: 2; }
}

/* === GUESTS (Phase 5) =====================================
   Hub tiles + audience landing pages. Reuses kit. Keeps the
   navy sidebar CTA card navy (only bump radius/shadow, not bg). */
/* hub tiles → warm cards, rounded image, terracotta arrow */
body.mig-warm .mig-guests-hub__tile { background: var(--mh-cream); border: 1px solid var(--wh-bd); border-radius: var(--wh-r); overflow: hidden; box-shadow: var(--wh-shadow-sm); transition: transform .25s ease, box-shadow .25s ease; }
body.mig-warm .mig-guests-hub__tile:hover { transform: translateY(-4px); box-shadow: var(--wh-shadow); }
body.mig-warm .mig-guests-hub__tile-arrow { display: inline-flex; align-items: center; gap: 8px; color: var(--mh-terracotta); font-family: Inter, system-ui, sans-serif; font-weight: 600; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; }
body.mig-warm .mig-guests-hub__tile-arrow::before { content: "Read more"; }
/* landing lead photo rounded */
body.mig-warm .mig-guests__lead-photo { border-radius: var(--wh-r); overflow: hidden; }
body.mig-warm .mig-guests__lead-photo img { border-radius: var(--wh-r); }
/* sidebar credibility cards — warm radius/border/shadow only (each keeps its own bg, so the navy CTA stays navy) */
body.mig-warm .mig-guests-card { border-radius: var(--wh-r); border-color: var(--wh-bd); box-shadow: var(--wh-shadow-sm); }
body.mig-warm .mig-guests-card--photo img { border-radius: var(--wh-r-sm); }
body.mig-warm .mig-guests-card__quote-byline { color: var(--mh-terracotta-2); }
/* guests FAQ — warm rows like the homepage FAQ */
/* guests FAQ is OPEN by default on desktop (custom JS) — don't box it like the collapsed homepage FAQ; just warm the toggle */
body.mig-warm .mig-guests-faq__toggle { color: var(--mh-terracotta); }
body.mig-warm .mig-guests__reviews-link { color: var(--mh-terracotta); }

/* === ABOUT / remaining (Phase 6) === */
/* round the Notable-guests photos (content images) */
body.mig-warm .mig-about-notable__tile-img-wrap,
body.mig-warm .mig-about-notable__tile-img-wrap img { border-radius: var(--wh-r); overflow: hidden; }
/* About — round the lead portrait + the sidebar credentials card (Samuel 2026-06-07) */
body.mig-warm .mig-about__portrait-img,
body.mig-warm .mig-about__portrait-ph { border-radius: var(--wh-r); }
/* About — round the mobile-only inline bio photo + drop its watermark (Samuel 2026-06-08; exempt from the square .mig-photo guard). This photo doesn't need attribution. */
body.mig-warm .mig-about__prose .mig-bio-inline .mig-photo { display: block; border-radius: var(--wh-r) !important; overflow: hidden; }
body.mig-warm .mig-about__prose .mig-bio-inline .mig-photo > img,
body.mig-warm .mig-about__prose .mig-bio-inline > img { border-radius: var(--wh-r) !important; }
body.mig-warm .mig-about__prose .mig-bio-inline .mig-photo::after { content: none !important; display: none !important; }
body.mig-warm .mig-about__sidebar,
body.mig-warm .mig-credentials { border-radius: var(--wh-r); }
/* Contact — round the sidebar (navy WhatsApp aside) + the form card (Samuel 2026-06-07) */
body.mig-warm .mig-contact__aside { border-radius: var(--wh-r); overflow: hidden; }
body.mig-warm .mig-contact__form-well { border-radius: var(--wh-r); }

/* Contact follow-ups (Samuel 2026-06-07):
   - Hide the "Office / Where I'm based" block — redundant (licence # also shows
     on the author card + home). With it gone, the navy WhatsApp block becomes the
     sole child of the rounded, clipped aside, so its bottom corners round too.
   - Round the WhatsApp CTA button.
   - Base theme.css rounds the Jetpack form fields + submit to --radius-sm (2px)
     with !important, so they read as square. Lift them to the warm radii to match
     the cards (fields 10px, submit 8px). !important needed to beat the base rule. */
body.mig-warm .mig-email-block { display: none; }
body.mig-warm .mig-whatsapp-block__btn { border-radius: var(--wh-r-btn); }

/* Contact aside — portrait card "the face behind the inbox" (Samuel 2026-06-08).
   Sits above the WhatsApp block. Hidden on mobile (<=900px, where the aside
   stacks below the long form and would only add scroll). The WhatsApp block now
   carries its own radius so it stays fully rounded once it is no longer the sole
   child of the clipped aside (no visual change — it already reads as rounded). */
body.mig-warm .mig-whatsapp-block { border-radius: var(--wh-r); }
body.mig-warm .mig-contact__portrait { background: var(--mh-cream); border: 1px solid var(--wh-bd); border-radius: var(--wh-r); overflow: hidden; }
body.mig-warm .mig-contact__portrait-img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; object-position: center 26%; }
body.mig-warm .mig-contact__portrait-body { padding: 22px 24px 24px; }
body.mig-warm .mig-contact__portrait-line { font-family: var(--mh-font-serif, Lora, Georgia, serif); font-size: 1.08rem; line-height: 1.5; color: var(--mh-navy); margin: 0; }
@media (max-width: 900px) { body.mig-warm .mig-contact__portrait { display: none; } }

/* Contact aside — secondary contact buttons under WhatsApp (Call / FaceTime / Text).
   auto-fit so the row reflows from 3 columns to 2 when the FaceTime button is hidden
   on non-Apple devices (it carries [hidden] → display:none → its track collapses). */
/* QA9 B5 (Samuel's iPhone pass): the auto-fit grid orphaned TEXT on its own row inside
   the narrower contact card (2+1 with a hole). Flex + flex:1 keeps however many alts
   are visible (3 on Apple, 2 elsewhere) in ONE evenly-shared row at every width. */
body.mig-warm .mig-whatsapp-block__alts { display: flex; gap: 8px; margin-top: 10px; }
body.mig-warm .mig-whatsapp-block__alts > * { flex: 1 1 0; min-width: 0; }
@media (max-width: 480px) {
  body.mig-warm .mig-whatsapp-block__alts > * { padding-inline: 6px; }
}
body.mig-warm .mig-whatsapp-block__alt { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 12px 6px; border: 1px solid rgba(253,251,247,.25); border-radius: var(--wh-r-btn); color: var(--mh-cream); text-decoration: none; font-family: var(--mh-font-ui, Inter, system-ui, sans-serif); font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; transition: background .16s ease, border-color .16s ease; }
body.mig-warm .mig-whatsapp-block__alt:hover { background: rgba(253,251,247,.08); border-color: rgba(253,251,247,.6); color: var(--mh-cream); }
body.mig-warm .mig-whatsapp-block__alt svg { width: 19px; height: 19px; fill: currentColor; }
/* our display:flex above out-specifies the UA's [hidden]{display:none}, so restore it */
body.mig-warm .mig-whatsapp-block__alt[hidden] { display: none; }

body.mig-warm .mig-contact__form-well input[type="text"],
body.mig-warm .mig-contact__form-well input[type="email"],
body.mig-warm .mig-contact__form-well input[type="tel"],
body.mig-warm .mig-contact__form-well input[type="url"],
body.mig-warm .mig-contact__form-well input[type="number"],
body.mig-warm .mig-contact__form-well select,
body.mig-warm .mig-contact__form-well textarea { border-radius: var(--wh-r-sm) !important; }

body.mig-warm .mig-contact__form-well button[type="submit"],
body.mig-warm .mig-contact__form-well .pushbutton-wide { border-radius: var(--wh-r-btn) !important; }

/* The Subject <select> sits inside a Jetpack wrapper DIV that draws its OWN
   square 1px border — so once the select is rounded you get a square border
   around a curved one. Strip the wrapper's border/background; the rounded
   select is the single visible control (its ::after chevron is unaffected). */
body.mig-warm .mig-contact__form-well .contact-form__select-wrapper {
  border: 0 !important;
  background: transparent !important;
  border-radius: var(--wh-r-sm) !important;
}

/* ── Cookie consent (WPConsent): the banner renders inside a SHADOW DOM, so theme
   CSS can't reach it — exact rounding is injected into the shadow root by
   assets/js/mig-warmhost-cookie.js (gated, enqueued only when warm is on).
   A plugin-level fallback (banner_button_corner = rounded) keeps the CTAs curved
   even if the script ever can't run. See WARMHOST-PLAN §8.
   Light-DOM fallback for the floating re-open button in case it's rendered
   outside the shadow root (the shim also styles it if it's inside): round +
   recolour from the plugin's off-brand blue to brand navy. ── */
body.mig-warm .wpconsent-consent-floating-button {
  border-radius: var(--wh-r-sm) !important;
  background: var(--mh-navy) !important;
  background-color: var(--mh-navy) !important;
}

/* ============================================================
   HOME TRUST STRIP — "Option D" dark band (TRUST-STRIP-SPEC).
   Gated: renders only when Warm Host is on (front-page.php branch),
   so all rules live here under body.mig-warm. Navy is kept as a warm
   anchor; warm radii (12px band / 10px card / 8px button) replace the
   spec's literal 4px. Awards = 3 white PNGs in assets/img/awards/.
   ============================================================ */
/* FULL-BLEED: the band butts directly against the hero above and About below
   (no cream framing) — tighter scroll + a stronger dark contrast moment. The
   section's padding/bg/rules are dropped and the container constraint removed;
   the band's inline padding re-centres content to --container (1200px). */
body.mig-warm .mh-trust { background: none; padding: 0; border: 0; }
body.mig-warm .mh-trust > .container { max-width: none; padding: 0; }

/* SEAMLESS-DARK transition (Samuel chose option 1): the hero's bottom scrim ramps
   fully to the band's top navy (#1d2e4d), and the band starts at that same navy and
   deepens downward — so the hero sinks into the band with no tonal step. Gated: only
   the home hero is affected (no other template has .mh-hero) and only when warm is on
   (the only time the band follows the hero). Higher specificity beats the base scrim. */
body.mig-warm .mh-hero__scrim--bottom {
  background: linear-gradient(180deg, rgba(14,27,50,.25) 0%, transparent 30%, transparent 48%, rgba(29,46,77,.85) 86%, #1d2e4d 100%);
}
/* the hero's 1px bottom border drew a hairline exactly at the seam — drop it so
   the hero flows into the band uninterrupted (this is what made the preview look
   smoother than the live build). */
body.mig-warm .mh-hero { border-bottom: 0; }
/* the hero text "well" backdrop is a radial gradient clipped to a rectangle, so
   its edges read as a hard panel behind the text. Drop it — the tone + left
   scrims and the H1 text-shadow carry legibility (as in the approved preview),
   so the text sits cleanly on the video with no box. */
body.mig-warm .mh-hero__well::before { display: none; }
body.mig-warm .mh-trustd__band {
  background: linear-gradient(180deg, #1d2e4d 0%, #1A2B4C 42%, #16243f 100%);
  border-radius: 0;
  /* own stacking context so the band's content paints ABOVE the hero's bottom
     scrim where they overlap — otherwise the scrim clips the card's top edge. */
  position: relative;
  z-index: 1;
  /* Top padding 0 + a negative margin pulls the band UP onto the hero's dark
     bottom (empty video below the hero text), so the trust content overlaps into
     the video and cuts real scroll. Kept within the scrim's dark fade zone so the
     seam stays seamless. Bottom padding fuller for the transition into About. */
  margin-top: -44px;
  padding-block: 40px 48px;
  /* +gutter so the content's left edge lines up with the hero H1/.container text
     (inset by the container gutter), not the bare viewport-centred edge. */
  padding-inline: max(var(--gutter), calc((100vw - var(--container)) / 2 + var(--gutter)));
  color: var(--mh-cream);
}
body.mig-warm .mh-trustd__grid {
  display: grid; grid-template-columns: 300px 1fr; gap: 50px;
  align-items: start;
}
/* left column = reviews card + awards stacked under it */
body.mig-warm .mh-trustd__left { display: flex; flex-direction: column; gap: 22px; }

/* Left: reviews card (2-up, no per-cell counts) */
body.mig-warm .mh-trustd__reviews {
  display: flex; align-items: stretch;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: var(--wh-r-sm);
  padding: 18px 20px;
}
body.mig-warm .mh-trustd__cell {
  flex: 1 1 0; display: flex; flex-direction: column; align-items: flex-start;
  gap: 6px; text-decoration: none; color: inherit;
}
body.mig-warm a.mh-trustd__cell:hover .mh-trustd__pname { color: #fff; }
body.mig-warm .mh-trustd__brand { display: block; }
body.mig-warm .mh-trustd__pname {
  font-family: var(--mh-font-ui, Inter, system-ui, sans-serif);
  font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  color: rgba(253,251,247,.7); transition: color .2s;
}
body.mig-warm .mh-trustd__stars { color: var(--mh-terracotta); font-size: 13px; letter-spacing: 1px; line-height: 1; }
body.mig-warm .mh-trustd__val {
  font-family: var(--mh-font-ui, Inter, system-ui, sans-serif);
  font-size: 19px; font-weight: 700; color: var(--mh-cream); line-height: 1;
}
body.mig-warm .mh-trustd__denom { font-size: 13px; font-weight: 500; color: rgba(253,251,247,.55); }
body.mig-warm .mh-trustd__divider { width: 1px; align-self: stretch; background: rgba(255,255,255,.12); margin: 0 20px; flex: none; }

/* Right: rotating quote on dark */
body.mig-warm .mh-rotator--ondark .mh-rotator__quote {
  color: var(--mh-cream); font-size: 1.75rem; line-height: 1.4;
}
body.mig-warm .mh-rotator--ondark .mh-rotator__quote::before,
body.mig-warm .mh-rotator--ondark .mh-rotator__quote::after { color: var(--mh-terracotta); }
body.mig-warm .mh-rotator--ondark .mh-rotator__attr { color: #e08b6f; }
body.mig-warm .mh-rotator--ondark .mh-rotator__attr::before { color: rgba(253,251,247,.45); }
body.mig-warm .mh-rotator--ondark .mh-rotator__dot::before { background: rgba(253,251,247,.3); }
body.mig-warm .mh-rotator--ondark .mh-rotator__dot:hover::before { background: rgba(253,251,247,.55); }
body.mig-warm .mh-rotator--ondark .mh-rotator__dot.is-active::before { background: var(--mh-terracotta); }

/* Awards — sit directly under the reviews card (no divider line, no CTA button) */
body.mig-warm .mh-trustd__awards-label {
  display: block;
  text-align: center;
  font-family: var(--mh-font-ui, Inter, system-ui, sans-serif);
  font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
  color: rgba(253,251,247,.5);
}
/* badges grouped and centred with comfortable spacing (a middle ground between
   edge-pushed and bunched), on both desktop and mobile. */
body.mig-warm .mh-trustd__awards-row { display: flex; align-items: center; justify-content: center; gap: 36px; margin-top: 12px; }
body.mig-warm .mh-trustd__award { height: 42px; width: auto; opacity: .9; }

/* Responsive ≤820px: stack the grid + baseline */
@media (max-width: 820px) {
  /* pull the band up onto the hero's dark bottom on mobile too, to close the gap
     (no eyebrow to crowd now); z-index from the base rule keeps the card unclipped. */
  body.mig-warm .mh-trustd__band { margin-top: -44px; padding-block: 24px var(--gutter); padding-inline: var(--gutter); }
  body.mig-warm .mh-trustd__grid { grid-template-columns: 1fr; gap: 28px; }
  body.mig-warm .mh-rotator--ondark .mh-rotator__quote { font-size: 1.4rem; }
  /* mobile (stacked): centre the rotating testimonial + byline + dots so it reads
     as a balanced "moment" instead of hugging the left; balance evens the lines.
     Desktop keeps it left-aligned (it sits in its own column beside the card). */
  body.mig-warm .mh-rotator--ondark .mh-rotator__slide { text-align: center; }
  body.mig-warm .mh-rotator--ondark .mh-rotator__quote { text-wrap: balance; }
  body.mig-warm .mh-rotator--ondark .mh-rotator__dots { justify-content: center; }
  body.mig-warm .mh-trustd__awards-row { justify-content: center; gap: 30px; }
}

/* ============================================================
   SITE-WIDE TRUST RAIL — "L1" thin one-liner, LIGHT (TRUST-RAIL-SPEC).
   Gated: renders only when Warm Host is on (trust-rail.php warm branch).
   Full-width sand band + top/bottom hairlines; content at --container.
   Left = eyebrow + rotating quote (constant height via quote-rotator) + dots;
   right = Tripadvisor · Google (5/5) + "Read 400+ reviews" CTA.
   ============================================================ */
body.mig-warm .mig-rail {
  background: var(--mh-sand);
  border-top: 1px solid var(--wh-bd);
  border-bottom: 1px solid var(--wh-bd);
}
body.mig-warm .mig-rail__inner { display: flex; align-items: center; gap: 40px; padding-block: 26px; }
body.mig-warm .mig-rail__q { flex: 1; min-width: 0; }
body.mig-warm .mig-rail__eyebrow {
  display: block;
  font-family: var(--mh-font-ui, Inter, system-ui, sans-serif);
  font-size: .72rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase;
  color: var(--mh-terracotta); margin-bottom: 6px;
}

/* right: scores + CTA */
body.mig-warm .mig-rail__aside { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; justify-content: flex-end; flex: none; }
body.mig-warm .mig-rail__scores { display: flex; align-items: center; }
body.mig-warm .mig-rail__score { display: flex; align-items: center; gap: 10px; padding: 0 18px; text-decoration: none; color: inherit; }
body.mig-warm .mig-rail__score:first-child { padding-left: 0; }
body.mig-warm .mig-rail__scm { display: flex; flex-direction: column; gap: 3px; }
body.mig-warm .mig-rail__pn { font-size: .62rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--mh-ink-2); white-space: nowrap; transition: color .2s; }
body.mig-warm a.mig-rail__score:hover .mig-rail__pn { color: var(--mh-navy); }
body.mig-warm .mig-rail__stars { color: var(--mh-terracotta); letter-spacing: 1px; font-size: .82rem; line-height: 1; }
body.mig-warm .mig-rail__stars svg { fill: var(--mh-terracotta); vertical-align: -2px; } /* #TR2-5: Facebook thumbs-up in the star row */
body.mig-warm .mig-rail__val { font-family: var(--mh-font-serif, Lora, Georgia, serif); color: var(--mh-navy); font-weight: 500; font-size: 1.2rem; line-height: 1; }
body.mig-warm .mig-rail__d { color: var(--mh-ink-2); font-size: .85rem; }
body.mig-warm .mig-rail__divider { width: 1px; height: 34px; background: var(--wh-bd); flex: none; }
body.mig-warm .mig-rail__cta {
  display: inline-flex; align-items: center; gap: 8px; white-space: nowrap;
  background: var(--mh-terracotta); color: #fff; text-decoration: none;
  font-family: var(--mh-font-ui, Inter, system-ui, sans-serif);
  font-size: .84rem; font-weight: 600; padding: 11px 22px; border-radius: var(--wh-r-btn);
  transition: background .2s;
}
body.mig-warm .mig-rail__cta:hover { background: #a95a3f; }
/* #TR2-5 Option B — DESKTOP ONLY (≥861). Mobile keeps the original layout untouched.
   The 3 ratings sit in a row with the button centred BELOW them; the whole block is pulled
   CLOSE to the quote (the quote column caps, so the block comes near it with a comfortable
   gap; spare space falls on the right). The Option-A under-quote lead link is unused here
   (kept in markup, hidden). The mobile button (.mig-rail__cta--foot) is the button shown. */
body.mig-warm .mig-rail__cta--lead { display: none; }
@media (min-width: 861px) {
  body.mig-warm .mig-rail__inner { gap: 56px; }
  body.mig-warm .mig-rail__q { max-width: 600px; }
  body.mig-warm .mig-rail__aside { flex: 0 0 auto; flex-direction: column; align-items: center; justify-content: center; gap: 18px; }
}

/* rotating quote on the light rail */
body.mig-warm .mh-rotator--rail .mh-rotator__quote { font-family: var(--mh-font-serif, Lora, Georgia, serif); color: var(--mh-navy); font-weight: 400; font-size: 1.3rem; line-height: 1.42; }
body.mig-warm .mh-rotator--rail .mh-rotator__quote::before,
body.mig-warm .mh-rotator--rail .mh-rotator__quote::after { color: var(--mh-terracotta); }
body.mig-warm .mh-rotator--rail .mh-rotator__attr { color: var(--mh-navy); font-size: .78rem; font-weight: 600; }
body.mig-warm .mh-rotator--rail .mh-rotator__attr::before { color: var(--mh-ink-2); }
body.mig-warm .mh-rotator--rail .mh-rotator__dots { margin-top: 12px; }

/* stack + centre on mobile — same lesson as the home strip: a single rotating
   testimonial reads more balanced centred than left-hugging; carry it across the
   whole rail (eyebrow, quote, dots, scores, CTA) for one coherent centred block. */
/* #TR2-8 (Samuel): left-align the rail on mobile so it matches the rest of the
   left-aligned mobile page instead of being the only centred block. */
@media (max-width: 860px) {
  body.mig-warm .mig-rail__inner { flex-direction: column; align-items: flex-start; text-align: left; gap: 18px; }
  body.mig-warm .mig-rail__q { width: 100%; }
  body.mig-warm .mh-rotator--rail .mh-rotator__slide { text-align: left; }
  body.mig-warm .mh-rotator--rail .mh-rotator__quote { text-wrap: pretty; }
  body.mig-warm .mh-rotator--rail .mh-rotator__dots { justify-content: flex-start; }
  body.mig-warm .mig-rail__aside { justify-content: flex-start; width: 100%; }
  /* #TR2-5: Facebook is a DESKTOP-ONLY addition — hide it + the divider before it on mobile so
     the strip stays exactly as it was (Tripadvisor + Google, the CTA button below). */
  body.mig-warm .mig-rail__score--fb { display: none; }
  body.mig-warm .mig-rail__divider:has(+ .mig-rail__score--fb) { display: none; }
}

/* ============================================================
   REVIEWS PAGE — curated wall + 6-group filter + load-more
   (REVIEWS-PAGE-PLAN Phase 1). Warm-gated; OFF = today's archive.
   ============================================================ */
body.mig-warm .mig-rev { background: var(--mh-sand); padding: 38px 0 72px; }
body.mig-warm .mig-rev__filter { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; align-items: center; margin: 0 0 32px; }
body.mig-warm .mig-rev__filter-label { font-family: var(--mh-font-ui, Inter, system-ui, sans-serif); font-size: .66rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--mh-ink-2); padding-left: 10px; }
body.mig-warm .mig-rev__filter-label:first-of-type { padding-left: 0; }
body.mig-warm .mig-rev__pill { font-family: var(--mh-font-ui, Inter, system-ui, sans-serif); font-size: .8rem; font-weight: 600; color: var(--mh-navy); background: #fff; border: 1px solid var(--wh-bd); padding: 9px 16px; border-radius: 99px; cursor: pointer; transition: background .15s, color .15s; }
body.mig-warm .mig-rev__pill:hover { border-color: var(--mh-navy); }
body.mig-warm .mig-rev__pill.is-on { background: var(--mh-navy); color: #fff; border-color: var(--mh-navy); }
body.mig-warm .mig-rev__pill-n { opacity: .55; font-weight: 500; margin-left: 2px; }
body.mig-warm .mig-rev__pill.is-on .mig-rev__pill-n { opacity: .8; }

/* contextual "Showing X · Show all" bar — appears only when an audience card has filtered the wall */
body.mig-warm .mig-rev__active { display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; margin: 0 0 28px; }
body.mig-warm .mig-rev__active[hidden] { display: none; }   /* equal-specificity hidden override (LESSONS.md #4) */
body.mig-warm .mig-rev__active span { font-family: var(--mh-font-ui, Inter, system-ui, sans-serif); font-size: .95rem; color: var(--mh-ink-2); }
body.mig-warm .mig-rev__active b { color: var(--mh-navy); font-weight: 600; }
body.mig-warm .mig-rev__clear { display: inline-flex; align-items: center; gap: 7px; font-family: var(--mh-font-ui, Inter, system-ui, sans-serif); font-size: .85rem; font-weight: 600; color: var(--mh-navy); background: #fff; border: 1px solid var(--wh-bd); padding: 9px 16px; border-radius: 99px; min-height: 44px; cursor: pointer; transition: background .15s, color .15s; }
body.mig-warm .mig-rev__clear:hover { background: var(--mh-navy); color: #fff; border-color: var(--mh-navy); }

body.mig-warm .mig-rev__wall { columns: 3; column-gap: 22px; }
@media (max-width: 1000px) { body.mig-warm .mig-rev__wall { columns: 2; } }
@media (max-width: 680px)  { body.mig-warm .mig-rev__wall { columns: 1; } }

body.mig-warm .mig-rev-card { break-inside: avoid; background: var(--mh-cream); border: 1px solid var(--wh-bd); border-radius: var(--wh-r); box-shadow: var(--wh-shadow-sm); padding: 22px 22px 18px; margin: 0 0 22px; } /* OI-06 2026-06-09: was a bespoke navy-tinted shadow (0 6px 18px -14px rgba(26,43,76,.4)) — reconciled to the warm --wh-shadow-sm token so this card's elevation matches every other warm card. Padding 22/22/18 kept (deliberate dense masonry-wall card). */
body.mig-warm .mig-rev-card.is-hidden { display: none; }
body.mig-warm .mig-rev-card__top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
body.mig-warm .mig-rev-card__stars { color: var(--mh-terracotta); display: inline-flex; gap: 1px; line-height: 1; }
body.mig-warm .mig-rev-card__src { display: inline-flex; align-items: center; gap: 5px; font-size: .62rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--mh-ink-2); }
body.mig-warm .mig-rev-card__hl { font-family: var(--mh-font-serif, Lora, Georgia, serif); font-weight: 600; color: var(--mh-navy); font-size: 1.05rem; line-height: 1.3; margin: 0 0 8px; }
body.mig-warm .mig-rev-card__quote { font-size: .92rem; color: #3a3a3a; }
body.mig-warm .mig-rev-card__q { display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; }
body.mig-warm .mig-rev-card.is-expanded .mig-rev-card__q { display: block; -webkit-line-clamp: none; overflow: visible; }
body.mig-warm .mig-rev-card__more { background: none; border: 0; padding: 7px 0 0; color: var(--mh-terracotta); font-weight: 600; font-size: .82rem; cursor: pointer; }
body.mig-warm .mig-rev-card__foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--wh-bd); }
body.mig-warm .mig-rev-card__name { font-size: .78rem; font-weight: 600; color: var(--mh-navy); }
body.mig-warm .mig-rev-card__link { font-size: .74rem; color: var(--mh-terracotta); text-decoration: none; white-space: nowrap; }
body.mig-warm .mig-rev-card__link:hover { text-decoration: underline; }

body.mig-warm .mig-rev__actions { text-align: center; margin-top: 32px; }
/* OI-07 (RI-03) 2026-06-09: "Load more reviews" now consumes the shared
   .btn .btn--primary component (uppercase, tracked, token padding/radius) for
   site-wide button consistency. The bespoke styling below is retired — to
   revert, uncomment these two rules and drop the btn classes in archive-testimonial.php.
   body.mig-warm .mig-rev__loadmore { display: inline-flex; align-items: center; background: var(--mh-terracotta); color: #fff; border: 0; font-family: var(--mh-font-ui, Inter, system-ui, sans-serif); font-weight: 600; font-size: .9rem; padding: 13px 28px; border-radius: var(--wh-r-btn); cursor: pointer; transition: background .2s; }
   body.mig-warm .mig-rev__loadmore:hover { background: #a95a3f; } */
body.mig-warm .mig-rev__browse { margin: 24px auto 0; max-width: 780px; font-size: .82rem; color: var(--mh-ink-2); line-height: 1.95; }
body.mig-warm .mig-rev__browse a { color: var(--mh-navy); text-decoration: none; border-bottom: 1px solid var(--wh-bd); }
body.mig-warm .mig-rev__browse a:hover { border-color: var(--mh-navy); }

/* ============================================================
   REVIEWS PAGE — hero · audience cards · moment · CTA
   (REVIEWS-PAGE-PLAN Phases 2–4). Warm-gated, main /testimonials/ only.
   ============================================================ */
/* --- credibility hero --- */
body.mig-warm .mig-rev-hero { position: relative; min-height: 540px; display: flex; align-items: flex-end; overflow: hidden; color: #fff; }
body.mig-warm .mig-rev-hero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% 26%; }
body.mig-warm .mig-rev-hero__scrim { position: absolute; inset: 0; background:
  linear-gradient(rgba(14,27,50,.5), rgba(14,27,50,.5)),
  linear-gradient(180deg, transparent 20%, rgba(14,27,50,.7) 100%),
  linear-gradient(100deg, rgba(14,27,50,.55), transparent 72%); }
body.mig-warm .mig-rev-hero__in { position: relative; padding-top: 58px; padding-bottom: 48px; }
body.mig-warm .mig-rev-hero__eyebrow { font-family: var(--mh-font-ui, Inter, system-ui, sans-serif); font-size: .72rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: #e08b6f; text-shadow: 0 1px 10px rgba(8,18,36,.5); }
body.mig-warm .mig-rev-hero__h1 { font-family: var(--mh-font-serif, Lora, Georgia, serif); font-weight: 500; font-size: clamp(2.2rem, 4.6vw, 3.4rem); line-height: 1.06; margin: .3em 0 .4em; color: #fff; text-shadow: 0 2px 26px rgba(8,18,36,.7), 0 1px 4px rgba(8,18,36,.5); }
body.mig-warm .mig-rev-hero__h1, body.mig-warm .mig-rev-hero__lead, body.mig-warm .mig-rev-hero__stats b { color: #fff; }
body.mig-warm .mig-rev-hero__lead { color: rgba(253,251,247,.94); }
body.mig-warm .mig-rev-hero__lead { font-family: var(--mh-font-serif, Lora, Georgia, serif); font-size: 1.12rem; line-height: 1.6; max-width: 48ch; color: rgba(253,251,247,.92); margin: 0 0 28px; }
body.mig-warm .mig-rev-hero__stats { display: flex; gap: 48px; flex-wrap: wrap; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.18); }
body.mig-warm .mig-rev-hero__stats b { font-family: var(--mh-font-serif, Lora, Georgia, serif); font-size: 2.6rem; line-height: 1; display: block; }
body.mig-warm .mig-rev-hero__stats span { font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: #e08b6f; margin-top: 8px; display: block; }

/* ===== Guests landing — immersive image hero (mirrors the reviews hero) ===== */
body.mig-warm .mig-guests-hero { position: relative; min-height: 540px; display: flex; align-items: flex-end; overflow: hidden; color: #fff; }
body.mig-warm .mig-guests-hero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 50%; }
body.mig-warm .mig-guests-hero__scrim { position: absolute; inset: 0; background:
  linear-gradient(rgba(14,27,50,.5), rgba(14,27,50,.5)),
  linear-gradient(180deg, transparent 20%, rgba(14,27,50,.7) 100%),
  linear-gradient(100deg, rgba(14,27,50,.55), transparent 72%); }
/* width:100% so the flex child fills the line; then max-width + auto margins
   (from .container) line the text up with the body column below it. */
body.mig-warm .mig-guests-hero__in { position: relative; width: 100%; padding-top: 58px; padding-bottom: 48px; }
body.mig-warm .mig-guests-hero__eyebrow { font-family: var(--mh-font-ui, Inter, system-ui, sans-serif); font-size: .72rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: #e08b6f; text-shadow: 0 1px 10px rgba(8,18,36,.5); }
body.mig-warm .mig-guests-hero__h1 { font-family: var(--mh-font-serif, Lora, Georgia, serif); font-weight: 500; font-size: clamp(2.2rem, 4.6vw, 3.4rem); line-height: 1.06; margin: .3em 0 .4em; color: #fff; text-shadow: 0 2px 26px rgba(8,18,36,.7), 0 1px 4px rgba(8,18,36,.5); }
/* styled on the container AND any inner <p> so it works whether the dek field is
   plain text or wysiwyg-wrapped. Wider measure so longer deks settle to two lines. */
body.mig-warm .mig-guests-hero__dek,
body.mig-warm .mig-guests-hero__dek p { font-family: var(--mh-font-serif, Lora, Georgia, serif); font-size: 1.12rem; line-height: 1.6; color: rgba(253,251,247,.92); text-shadow: 0 1px 14px rgba(8,18,36,.55); }
body.mig-warm .mig-guests-hero__dek { max-width: 42rem; margin: 0; }
body.mig-warm .mig-guests-hero__dek p { margin: 0; }
@media (max-width: 768px) {
  body.mig-warm .mig-guests-hero { min-height: 460px; }
  body.mig-warm .mig-guests-hero__in { padding-top: 44px; padding-bottom: 40px; }
}

/* --- find people like you --- */
body.mig-warm .mig-rev-aud { background: var(--mh-cream); padding: 66px 0; }
body.mig-warm .mig-rev-aud__head { text-align: center; max-width: 620px; margin: 0 auto; }
body.mig-warm .mig-rev-aud__head h2 { font-family: var(--mh-font-serif, Lora, Georgia, serif); font-size: 2rem; color: var(--mh-navy); margin: .3em 0 .2em; font-weight: 600; }
body.mig-warm .mig-rev-aud__head p { color: var(--mh-ink-2); margin: 0; }
body.mig-warm .mig-rev-aud__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 36px; }
body.mig-warm .mig-rev-aud__dots { display: none; }   /* carousel dots — mobile only (shown in the ≤900px block) */
body.mig-warm .mig-rev-aud__card { position: relative; border-radius: var(--wh-r); overflow: hidden; aspect-ratio: 4/5; box-shadow: var(--wh-shadow); text-decoration: none; display: block; }
body.mig-warm .mig-rev-aud__card img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
body.mig-warm .mig-rev-aud__card:hover img { transform: scale(1.05); }
body.mig-warm .mig-rev-aud__ov { position: absolute; inset: 0; background: linear-gradient(transparent 35%, rgba(14,27,50,.9)); display: flex; flex-direction: column; justify-content: flex-end; padding: 22px; color: #fff; }
body.mig-warm .mig-rev-aud__ov b { font-family: var(--mh-font-serif, Lora, Georgia, serif); font-size: 1.3rem; line-height: 1.15; }
body.mig-warm .mig-rev-aud__n { font-size: .74rem; color: #e08b6f; font-weight: 600; margin-top: 4px; }

/* --- cinematic moment --- */
body.mig-warm .mig-rev-moment { position: relative; min-height: 60vh; display: flex; align-items: center; overflow: hidden; }
body.mig-warm .mig-rev-moment__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
body.mig-warm .mig-rev-moment__scrim { position: absolute; inset: 0; background: rgba(14,27,50,.66); }
body.mig-warm .mig-rev-moment__in { position: relative; text-align: center; width: 100%; }
body.mig-warm .mig-rev-moment .mh-rotator__quote { font-size: clamp(1.5rem, 3.2vw, 2.3rem); line-height: 1.3; }
body.mig-warm .mig-rev-moment .mh-rotator__slide { text-align: center; }
body.mig-warm .mig-rev-moment .mh-rotator__dots { justify-content: center; }

/* --- CTA --- */
body.mig-warm .mig-rev-cta { background: var(--mh-navy); color: #fff; text-align: center; padding: 70px 28px; }
body.mig-warm .mig-rev-cta__h { font-family: var(--mh-font-serif, Lora, Georgia, serif); font-size: 2.1rem; margin: 0 0 10px; font-weight: 500; color: #fff; }
body.mig-warm .mig-rev-cta__p { color: #c2cbdd; max-width: 52ch; margin: 0 auto 26px; }
/* CTA button now uses the site-standard .btn .btn--primary (uppercase, letter-spaced,
   body font) for consistency with every other CTA. Only a small size bump remains. */
body.mig-warm .mig-rev-cta__btn { padding: 1rem 2rem; }

/* --- read more by audience (designed chips) --- */
/* --- read more by audience — 3-section index (R5) · desktop 3 cols · mobile 1 col + D1 terracotta section rule --- */
body.mig-warm .mig-rev-browse { background: var(--mh-cream); padding: 56px 0 62px; border-top: 1px solid var(--wh-bd); }
body.mig-warm .mig-rev-browse__h { font-family: var(--mh-font-serif, Lora, Georgia, serif); font-size: clamp(1.5rem, 3vw, 1.9rem); color: var(--mh-navy); margin: 0 0 30px; font-weight: 600; text-align: center; }
body.mig-warm .mig-rev-browse__cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 44px; max-width: 760px; margin: 0 auto; align-items: start; }
body.mig-warm .mig-rev-browse__row { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 9px 2px; border-bottom: 1px solid var(--wh-bd); text-decoration: none; transition: color .15s ease, padding .15s ease; }
body.mig-warm .mig-rev-browse__row:hover { padding-left: 6px; }
body.mig-warm .mig-rev-browse__name { font-family: var(--mh-font-ui, Inter, system-ui, sans-serif); font-weight: 500; font-size: .95rem; color: var(--mh-navy); }
body.mig-warm .mig-rev-browse__row:hover .mig-rev-browse__name { color: var(--mh-terracotta); }
body.mig-warm .mig-rev-browse__n { font-variant-numeric: tabular-nums; font-size: .8rem; color: var(--mh-ink-2); }
@media (max-width: 720px) {
  body.mig-warm .mig-rev-browse__cols { grid-template-columns: 1fr; gap: 0; max-width: 420px; }
  body.mig-warm .mig-rev-browse__sec { border-bottom: 2px solid #e08b6f; }
  body.mig-warm .mig-rev-browse__sec:last-child { border-bottom: 0; }
  body.mig-warm .mig-rev-browse__sec .mig-rev-browse__row:last-child { border-bottom: 0; }
}

/* --- compact audience-archive hero (navy, no photo) --- */
body.mig-warm .mig-rev-hero--aud { min-height: 0; background: var(--mh-navy); align-items: stretch; }
body.mig-warm .mig-rev-hero--aud .mig-rev-hero__in { padding-top: 38px; padding-bottom: 42px; }
body.mig-warm .mig-rev-hero__back { display: inline-block; font-family: var(--mh-font-ui, Inter, system-ui, sans-serif); font-size: .8rem; font-weight: 600; letter-spacing: .03em; color: #c2cbdd; text-decoration: none; margin-bottom: 16px; transition: color .2s ease; }
body.mig-warm .mig-rev-hero__back:hover { color: #fff; }

@media (max-width: 900px) {
  /* audience cards: horizontal swipe carousel — big desktop-size cards that peek the next */
  body.mig-warm .mig-rev-aud__grid { display: flex; grid-template-columns: none; gap: 14px; margin-top: 30px;
    overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch;
    padding-bottom: 12px; scrollbar-width: none; }
  body.mig-warm .mig-rev-aud__grid::-webkit-scrollbar { display: none; }
  body.mig-warm .mig-rev-aud__card { flex: 0 0 80%; scroll-snap-align: center; aspect-ratio: 4/5; }
  body.mig-warm .mig-rev-aud__ov { background: linear-gradient(transparent 38%, rgba(14,27,50,.9)); padding: 20px; }
  body.mig-warm .mig-rev-aud__ov b { font-size: 1.4rem; line-height: 1.14; }
  body.mig-warm .mig-rev-aud__ov b,
  body.mig-warm .mig-rev-aud__n { text-shadow: 0 1px 10px rgba(8,18,36,.5); }
  /* carousel position dots (built by JS) */
  body.mig-warm .mig-rev-aud__dots { display: flex; gap: 7px; justify-content: center; margin-top: 4px; }
  body.mig-warm .mig-rev-aud__dots i { width: 7px; height: 7px; border-radius: 50%; background: var(--wh-bd); transition: width .2s, background .2s; }
  body.mig-warm .mig-rev-aud__dots i.on { background: var(--mh-terracotta); width: 18px; border-radius: 4px; }
  /* hero: crop out the doorway/dead space on the right so the group's rightmost guest sits near the edge */
  body.mig-warm .mig-rev-hero__bg { object-position: 52% 30%; }
  /* 2×2 grid so the columns line up (flex-wrap left them ragged: 100+ under 5.0, etc.) */
  body.mig-warm .mig-rev-hero__stats { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 24px; }
  body.mig-warm .mig-rev-hero__stats b { font-size: 2rem; }
  body.mig-warm .mig-rev-moment .mh-rotator__quote { font-size: 1.35rem; }
}

/* ============================================================
   DESIGN-QA FIXES — 2026-06-09 (see MIG redesign/DESIGN-QA-PLAN.md)
   Additive, scoped under body.mig-warm. Reversible.
   ============================================================ */

/* DQ-001 — Eyebrow / small-caps label WCAG AA on LIGHT backgrounds.
   Deepen terracotta #C86A4C (~3.3:1, fails) -> #A9573D (>=4.5:1, passes).
   Dark-band eyebrows are re-lit immediately below so they stay legible on navy. */
body.mig-warm .eyebrow,
body.mig-warm .mig-stat__label,
body.mig-warm .mh-journal__cat,
body.mig-warm .mig-article-meta__cat,
body.mig-warm .mig-article-eyebrow,
body.mig-warm .mig-author-card__eyebrow,
body.mig-warm .mig-comments__eyebrow,
body.mig-warm .mig-cat-sidebar__eyebrow,
body.mig-warm .mig-cat-sidebar__sub-eyebrow,
body.mig-warm .mig-post-card__cat,
body.mig-warm .mig-itin-filters__label,
body.mig-warm .mig-itin-arrangement__label,
body.mig-warm .mig-credentials__eyebrow,
body.mig-warm .mig-whatsapp-block__eyebrow,
body.mig-warm .mig-about-workedwith__cat,
body.mig-warm .mh-home-guests__preview-eyebrow,
body.mig-warm .mig-trust-rail__eyebrow {
  color: var(--accent);
}
/* Re-light EVERY terracotta eyebrow/kicker/label sitting on a dark navy band to the
   light terracotta #e08b6f (passes AA ~5:1 on navy). Covers all navy sections incl. the
   footer, philosophy, the CTA bands, and hero kickers — the deepened accent would be
   navy-on-navy-dark (~2.3:1) on these. */
body.mig-warm .mig-philosophy .eyebrow,
body.mig-warm .mig-philosophy .mig-stat__label,
body.mig-warm .mig-philosophy__eyebrow,
body.mig-warm .mig-itin-cta .eyebrow,
body.mig-warm .mig-itin-cta__eyebrow,
body.mig-warm .mh-homecta .eyebrow,
body.mig-warm .mh-homecta__eyebrow,
body.mig-warm .mig-rev-cta .eyebrow,
body.mig-warm .mig-rev-cta__eyebrow,
body.mig-warm .mig-footer .eyebrow,
body.mig-warm .mig-footer__col-head,
body.mig-warm .mh-hero__kicker,
body.mig-warm .mig-hero__eyebrow,
body.mig-warm .mig-hero__kicker,
body.mig-warm .bg-navy .eyebrow,
body.mig-warm .bg-navy .mig-stat__label {
  color: #e08b6f !important; /* beats the theme's .mig-footer__col-head{color:var(--mh-terracotta)!important} (my selectors are more specific) */
}

/* DQ-027 — Audience-page hero "strange position": the hero is display:flex, so the
   inner .container collapsed to content width and margin:0 auto CENTRED it in the band
   (the LESSONS.md flex-child trap). The photo hero needs flex (bottom-anchored text over
   photo); the short navy audience variant does not. Make it block so .container fills to
   1200 and the content left-anchors to the site's left edge. */
body.mig-warm .mig-rev-hero--aud { display: block; }
/* DQ-069 — remove the photo-hero text-shadow on the flat-navy audience hero (it left a
   faint smudge-box behind the heading). */
body.mig-warm .mig-rev-hero--aud .mig-rev-hero__h1,
body.mig-warm .mig-rev-hero--aud .mig-rev-hero__eyebrow,
body.mig-warm .mig-rev-hero--aud .mig-rev-hero__lead { text-shadow: none; }

/* DQ-017 — Section headers: left-align the two outliers (Guests, FAQ) so every
   homepage band header shares one left datum (Samuel's call). The others are
   already left-aligned. */
body.mig-warm .mh-home-guests__head,
body.mig-warm .mh-faq__head {
  text-align: left;
  margin-left: 0;
  margin-right: 0;
}

/* DQ-040 + DQ-030 — Inline links in body-prose containers that fall through to the
   bare navy/no-underline base style: give them the canonical terracotta + underline-
   at-rest treatment so they read as links without hovering. */
body.mig-warm .mig-philosophy__body a,
body.mig-warm .mig-whatsapp-block__body a,
body.mig-warm .mig-email-block__office a,
body.mig-warm .mig-itin-sites__note a,
body.mig-warm .mig-404__text a,
body.mig-warm .mig-search__none-links a {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}
body.mig-warm .mig-philosophy__body a:hover,
body.mig-warm .mig-search__none-links a:hover { color: var(--accent-press); }
/* the home Philosophy band is navy → its links need the LIGHT terracotta, not the deep one */
body.mig-warm .mig-philosophy__body a { color: #e08b6f; }
body.mig-warm .mig-philosophy__body a:hover { color: #f0a587; }
body.mig-warm .mig-search__none-links { margin-top: 14px; font-weight: 600; }
body.mig-warm .mig-search__none-links span { color: var(--mh-ink-2); margin: 0 6px; }

/* DQ-029 — Policy/data tables (cookie, privacy) overflow on phones. Make them
   horizontally scrollable at narrow widths instead of crushing to illegible. */
@media (max-width: 760px) {
  body.mig-warm .mig-page-content .entry-content table {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  body.mig-warm .mig-page-content .entry-content table th,
  body.mig-warm .mig-page-content .entry-content table td { white-space: nowrap; }
}

/* DQ-021 — Two card titles are coded as <span> so they miss the global heading
   text-wrap:balance and orphan a word at 390. Add balance to them. */
body.mig-warm .mh-home-guests__row-title,
body.mig-warm .mig-itin-relcard__title { text-wrap: balance; }

/* DQ-026 — nowrap utility for named units (applied to specific units content-side; CSS hook here). */
body.mig-warm .nowrap { white-space: nowrap; }

/* DQ-039 — Mobile footer: keep 3 link columns across (was 2-col at ≤580, which
   orphaned the Contact column on a half-empty row). Tighter column gap so the
   three fit at 390. Falls back gracefully — labels wrap within their column. */
@media (max-width: 580px) {
  body.mig-warm .mig-footer__main {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-5) var(--space-3);
  }
  body.mig-warm .mig-footer__brand { grid-column: 1 / -1; }
}

/* DQ-010 (demo — home CTA) — match the pre-footer CTA inner to the footer width so
   its content edge lines up with the footer below (was 1100 vs 1200 = 50px step). */
body.mig-warm .mh-homecta__inner { max-width: var(--w-section); }

/* DQ-017 follow-up — when the FAQ heading was left-aligned, the questions list below
   stayed centred (margin:auto), creating a left-header / centred-questions mismatch.
   Left-align the list to share the heading's left edge (best practice: one reading edge). */
body.mig-warm .mh-faq__list { margin-left: 0; margin-right: 0; }

/* DQ-004 + DQ-003 — About page bands stepped in/out (body 1100, "worked with" 852,
   "notable" heading centred at 720) against the 1200 hero/notable/footer. Bring the
   narrow body bands onto the section width so left+right edges line up with the rest;
   the notable heading just needs un-centring. Verified with edge-audit. */
body.mig-warm .mig-about__inner,
body.mig-warm .mig-about-workedwith__inner {
  max-width: var(--w-section);
  margin-inline: auto;
  padding-inline: var(--gutter);
}
/* Notable guests is a SHOWCASE (names + photos), not body copy — centre it deliberately
   (Samuel's call, agreed) so it reads as an intentional highlight, not a stepped band. */
body.mig-warm .mig-about-notable__head,
body.mig-warm .mig-about-notable__roster { text-align: center; }
body.mig-warm .mig-about-notable__head { margin-inline: auto; }
/* Guest FAQ — match the heading to its left-aligned questions (and to the home FAQ),
   fixing the centre-heading / left-questions mismatch. */
body.mig-warm .mig-guests-faq__heading { text-align: left; }

/* DQ-028 — Page hero used a 1200 inner with NO side padding (content edge 120) while
   every other band is a .container (content edge 144). That left a 24px step between
   every page's hero and its body. Give the hero the same gutter so the header lines up
   with the content below it, site-wide. */
body.mig-warm .mig-page-hero__inner { padding-inline: var(--gutter); }

/* DQ-003 (Contact) — body 1100 centred (170) vs 1200 hero/footer. Match section width. */
body.mig-warm .mig-contact__inner {
  max-width: var(--w-section);
  margin-inline: auto;
  padding-inline: var(--gutter);
}
/* DQ-028 (Itineraries archive) — filters + grid inners were 1200 with no gutter
   (content edge 120) vs the 144 standard. Add the gutter so they line up. */
body.mig-warm .mig-itin-filters__inner,
body.mig-warm .mig-itin-grid__inner { padding-inline: var(--gutter); }

/* DQ-075 (Search) — results sat in a 760 centred column (340) under the full hero.
   Bring onto the section width so they line up with the hero/footer. */
body.mig-warm .mig-search__inner {
  max-width: var(--w-section);
  margin-inline: auto;
  padding-inline: var(--gutter);
}
/* DQ-016 (Guests FAQ) — band centred at 752 (344). Left-anchor to the section edge;
   answer text stays capped to a readable measure (Samuel's condition). */
body.mig-warm .mig-guests-faq__inner {
  max-width: var(--w-section);
  margin-inline: auto;
  padding-inline: var(--gutter);
}
body.mig-warm .mig-guests-faq__list { margin-inline: 0; max-width: var(--w-prose); }

/* DQ-023 / DQ-010 (Single itinerary CTA) — the navy CTA inner was 880 centred (280),
   bulging wider than the reading column and not matching the footer. Bring it onto the
   section width like the home CTA so the navy close aligns to the footer. (The reading
   body/FAQ/related stay a centred reading column — correct for a long-form page.) */
body.mig-warm .mig-itin-cta__inner {
  max-width: var(--w-section);
  margin-inline: auto;
  padding-inline: var(--gutter);
}
/* #TR2-B1 (Samuel): on mobile the itinerary CTA band content sat at 48px (section gutter 24
   + inner padding-inline 24 = doubled) while the trust rail below sits at 24px — the band
   read as shifted right. Drop the section's own horizontal padding at mobile so the inner's
   single 24px gutter governs, matching the rail + the site standard. Desktop (where the
   centred inner is tuned to the footer width) is untouched. */
@media (max-width: 860px) {
  body.mig-warm .mig-itin-cta { padding-inline: 0; }
}

/* Itinerary closing band — per-itinerary photo (2026-06-09). Same treatment as the guest
   /reviews closer (OI-24 band v4): copy stays left over solid navy; a photo relevant to the
   itinerary bleeds in from the right under a navy gradient veil. DESKTOP ONLY (≥1025px) —
   below that the photo + veil hide and it falls back to the clean navy text band. The text
   column is capped so it never runs under the photo; image markup is gated in PHP to the
   18 mapped itineraries, so unmapped ones render the plain band unchanged. */
body.mig-warm .mig-itin-cta--photo {
  position: relative; overflow: hidden;
}
body.mig-warm .mig-itin-cta--photo .mig-itin-cta__img {
  position: absolute; right: 0; top: 0; bottom: 0; width: 52%; height: 100%;
  object-fit: cover;
}
body.mig-warm .mig-itin-cta--photo .mig-itin-cta__veil {
  position: absolute; right: 0; top: 0; bottom: 0; width: 52%; pointer-events: none;
  background: linear-gradient(to right, var(--mh-navy) 0%, rgba(26,43,76,.88) 16%, rgba(26,43,76,.25) 50%, rgba(26,43,76,0) 76%);
}
body.mig-warm .mig-itin-cta--photo .mig-itin-cta__inner { position: relative; z-index: 2; }
body.mig-warm .mig-itin-cta--photo .mig-itin-cta__title,
body.mig-warm .mig-itin-cta--photo .mig-itin-cta__lead { max-width: 480px; }
@media (max-width: 1024px) {
  body.mig-warm .mig-itin-cta--photo .mig-itin-cta__img,
  body.mig-warm .mig-itin-cta--photo .mig-itin-cta__veil { display: none; }
  body.mig-warm .mig-itin-cta--photo .mig-itin-cta__title,
  body.mig-warm .mig-itin-cta--photo .mig-itin-cta__lead { max-width: none; }
}

/* DQ-028 (Policy + blog containers) — like the hero, these 1200 inners had no side
   gutter, so their content sat at 120 vs the 144 standard. Add the gutter to align. */
body.mig-warm .mig-page-content__inner,
body.mig-warm .mig-blog__inner { padding-inline: var(--gutter); }

/* Pagination double-box bug — paginate_links() wraps each number as
   <a class="page-numbers"><span class="mig-pagination__btn">N</span></a>, and the base
   rule boxes BOTH the <a> and the inner span → a box-in-a-box. Make the inner span
   pass-through so only the outer link/button is the box. (current keeps its navy fill
   via the outer .page-numbers.current.) */
body.mig-warm .mig-pagination__btn { display: contents; color: inherit; }
/* ^ color:inherit so the inner span doesn't keep its own navy colour — otherwise the
   CURRENT page (navy bg) shows a navy number on navy = invisible. Now it inherits the
   parent's colour (cream on the current item, navy on the rest). */

/* RC-01 — Contact form-level ERROR summary was red text on a red Jetpack bar (the theme's
   per-field error colour leaked onto the summary box). Force light text so it's readable. */
body.mig-warm .contact-form__error { color: #fff !important; }

/* RS-02 — Blog tag chips were sand bg + transparent border = invisible on the sand body
   under Warm Host. Give them a cream fill + a faint border so they read as chips. */
body.mig-warm .mig-tag-chips__chip {
  background: var(--mh-cream);
  border: 1px solid var(--mh-rule);
}

/* RI-01 — Mobile FAQ answers kept a desktop padding-right:56px inside an 18px card, so at
   390px the text sat ~74px off the right. Reset it on small screens. */
@media (max-width: 600px) {
  body.mig-warm .mh-faq__a p { padding-right: 0; }
}

/* ============================================================
   TERRACOTTA WCAG-AA FIX (Samuel approved 2026-06-09)
   The brand terracotta #C86A4C fails AA as text (~3.3:1) and as a button fill
   (~3.6:1). Deepen the accent tokens to #984C34 — the lightest terracotta that
   passes 4.5:1 on every sand band AND as a button fill with cream text. Decorative
   borders/rules deepen too (negligible visually). Navy-context terracotta text is
   handled by the light re-light rules. Verified with contrast-audit.py.
   ============================================================ */
body.mig-warm {
  --mh-terracotta: #984C34;
  --mh-terracotta-2: #88442E;
  --accent: #984C34;
  --accent-press: #88442E;
}

/* Contrast sweep stragglers (2026-06-09) — the last few AA fails the terracotta deepening surfaced. */
/* more terracotta labels that sit on navy/dark → light terracotta */
body.mig-warm .mig-author-card__eyebrow,
body.mig-warm .ghero__eyebrow,
body.mig-warm .mig-gallery-hero__eyebrow { color: #e08b6f !important; }
/* gallery: nav is transparent over the dark hero → its links + active terracotta need to read light */
body.mig-warm .page-gallery .mig-nav__link,
body.mig-warm .ghero a,
body.mig-warm .ghero__cta { color: #f4ede6 !important; }
/* muted grey on the navy CTA contact card was 4.26 — lighten to clear AA on navy */
body.mig-warm .mh-homecta__line-modes { color: #aeb7c5; }
/* decorative greys too light to read on sand (breadcrumb separator, the big 404) */
body.mig-warm .mig-breadcrumb__sep { color: var(--mh-ink-2); }
body.mig-warm .mig-404__number { color: var(--accent); }

/* A11y skip-link — visible only on focus */
.mig-skip-link { position:absolute; left:8px; top:-48px; z-index:2000; background:var(--mh-navy); color:#fff; padding:10px 18px; border-radius:0 0 8px 8px; font-weight:600; font-size:14px; transition:top .15s; text-decoration:none; }
.mig-skip-link:focus { top:0; outline:2px solid #e08b6f; }
#main:focus { outline:none; }

/* OI-07 (RI-04) 2026-06-09: terracotta-fill buttons (.btn--primary, incl. the
   reviews "Load more") sit on navy bands (hero, CTA) AND on sand/cream bands.
   The default terracotta focus ring is near-invisible on navy (terracotta-on-navy
   ~1.6:1). Give primary buttons a two-tone keyboard-focus ring — cream inner
   outline (reads on navy) + navy outer ring (reads on sand/cream) — so it's clear
   on every band. Keyboard focus only; pointer clicks are unaffected. */
body.mig-warm .btn--primary:focus-visible {
  outline: 2px solid var(--mh-cream);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px var(--mh-navy);
}

/* OI-03 2026-06-09: the /guests/ hub has 5 audience tiles in a 3-up grid, so the
   last row orphans (5 = 3+2 at ≥1024; 5 = 2+2+1 at 700–1023 → a lone tile bottom-left).
   Switch the grid to flex-wrap with a centred last row so any tile count balances
   (orphans centre instead of hanging left). Full rows stay edge-to-edge (exact
   per-breakpoint basis, −1px wrap safety); gap is inherited from the theme rule. */
body.mig-warm .mig-guests-hub__grid { display: flex; flex-wrap: wrap; justify-content: center; }
body.mig-warm .mig-guests-hub__tile { flex: 0 1 100%; }
@media (min-width: 700px) {
  body.mig-warm .mig-guests-hub__tile { flex-basis: calc((100% - var(--space-6)) / 2 - 1px); }
}
@media (min-width: 1024px) {
  body.mig-warm .mig-guests-hub__tile { flex-basis: calc((100% - 2 * var(--space-6)) / 3 - 1px); }
}

/* OI-17 2026-06-09: the About body's section heading "My guiding philosophy" was an
   h3 directly under the page h1 (a heading-level skip). Promoted to h2 in the page
   content for correct semantics; pin About-prose h2 to the previous h3 size so the
   approved visual is unchanged (pure a11y fix, zero visual delta). */
body.mig-warm .mig-about__prose h2 {
  font-size: 1.5rem; font-weight: 600; line-height: 1.25; margin: 40px 0 16px; letter-spacing: 0;
}

/* OI-22 / OI-23 2026-06-09: the guests CTA "Let's talk" button is now FULL-WIDTH so it
   reads as an equal, parallel route to the full-width "Send WhatsApp" button in the
   last-minute block directly below it (two equal contact routes, consistent width).
   (Supersedes the earlier left-aligned auto-width treatment — that was right when it
   was a lone button; once paired with the full-width WhatsApp block, matched full-width
   is the coherent choice.) */
body.mig-warm .mig-guests-card__cta-btn { width: 100%; margin-inline: 0; }

/* OI-23: the shared "For last-minute trips" WhatsApp block sits under the CTA card on
   every audience. On desktop it's a flex child of .mig-guests-sidebar (inherits the
   column gap). On mobile the sidebar is display:contents, so the block becomes a grid
   item of .mig-guests__inner — give it an order right after the CTA card (order 8) and
   the same width cap as the sibling cards so it doesn't balloon full-bleed. */
@media (max-width: 899px) {
  body.mig-warm .mig-guests .mig-whatsapp-block { order: 9; max-width: 460px; padding: 26px 22px; }
  /* keep Call / FaceTime / Text on one row in the narrower mobile card (the block's
     36px desktop padding is too wide here); auto-fit still collapses to 2-up when
     FaceTime is hidden on non-Apple devices. */
  body.mig-warm .mig-guests .mig-whatsapp-block__alts { grid-template-columns: repeat(auto-fit, minmax(76px, 1fr)); }
}

/* OI-24 2026-06-09: de-navy the guest contact cards (Samuel: the two navy boxes were too
   dominant in the otherwise cream sidebar). Both become cream cards, consistent with the
   sibling sidebar cards; the navy emphasis moves to a new pre-footer CTA band. The
   "Plan your tour" + "For last-minute trips" headers now read as a matched pair.
   Scoped to .mig-guests so the CONTACT page WhatsApp block stays navy. */
body.mig-warm .mig-guests-card--cta { background: var(--mh-cream); color: var(--mh-ink); border-color: var(--wh-bd); }
body.mig-warm .mig-guests-card__cta-intro { color: var(--mh-ink); }
/* "Plan your tour" header uses the .eyebrow class in markup → it matches every sibling
   sidebar-card header (small caps, terracotta) automatically; no extra rule needed. */

body.mig-warm .mig-guests .mig-whatsapp-block { background: var(--mh-cream); color: var(--mh-ink); border: 1px solid var(--wh-bd); border-radius: var(--wh-r); box-shadow: var(--wh-shadow-sm); }
/* "For last-minute trips" → the same small-caps terracotta eyebrow as the other sidebar
   card headers (the block's serif title only applies on the navy contact page). */
body.mig-warm .mig-guests .mig-whatsapp-block__title {
  font-family: var(--font-body); font-size: var(--t-eyebrow); font-weight: 600;
  text-transform: uppercase; letter-spacing: var(--tracking-widest);
  color: var(--accent); line-height: 1.4; margin: 0 0 var(--space-3);
}
body.mig-warm .mig-guests .mig-whatsapp-block__body { color: var(--mh-ink); }
body.mig-warm .mig-guests .mig-whatsapp-block__alt { border-color: var(--mh-rule-strong); color: var(--mh-navy); }
body.mig-warm .mig-guests .mig-whatsapp-block__alt:hover { background: rgba(26,43,76,.05); border-color: var(--mh-navy); color: var(--mh-navy); }
body.mig-warm .mig-guests .mig-whatsapp-block__alt svg { fill: var(--mh-navy); }
body.mig-warm .mig-guests .mig-whatsapp-block__number { color: var(--mh-navy); }
/* "Send WhatsApp" stays terracotta — it reads well on cream and is the primary action. */

/* OI-24 band v4 (Samuel 2026-06-09): the guest page closer. Text invitation on the left
   over navy; a photo of Samuel guiding bleeds in from the right, with a navy gradient veil
   fading it into the text side. DESKTOP ONLY (≥1025px) — on tablet/mobile the photo + veil
   hide and it falls back to the clean left-aligned text band. Text always sits over solid
   navy (left ~48%), so it stays fully legible regardless of the photo. */
body.mig-warm .mig-guests-cta-band {
  position: relative; overflow: hidden; background: var(--mh-navy);
  min-height: 360px; display: flex; align-items: center;
}
body.mig-warm .mig-guests-cta-band__img {
  position: absolute; right: 0; top: 0; bottom: 0; width: 52%; height: 100%;
  object-fit: cover; object-position: 50% 42%;
}
body.mig-warm .mig-guests-cta-band__veil {
  position: absolute; right: 0; top: 0; bottom: 0; width: 52%;
  background: linear-gradient(to right, var(--mh-navy) 0%, rgba(26,43,76,.88) 16%, rgba(26,43,76,.25) 50%, rgba(26,43,76,0) 76%);
}
body.mig-warm .mig-guests-cta-band__inner {
  position: relative; z-index: 2; width: 100%;
  max-width: var(--w-section); margin: 0 auto; padding-block: 56px; padding-inline: var(--gutter);
}
body.mig-warm .mig-guests-cta-band__h2 {
  font-family: var(--font-display); font-size: clamp(28px, 2.6vw, 38px); font-weight: 400;
  color: var(--mh-cream); line-height: 1.14; letter-spacing: -0.015em; margin: 0 0 14px; text-wrap: balance;
}
body.mig-warm .mig-guests-cta-band__lead {
  font-size: 1.0625rem; line-height: 1.65; color: rgba(253,251,247,0.82);
  margin: 0 0 26px; max-width: 460px; text-wrap: pretty;
}
body.mig-warm .mig-guests-cta-band__lead p { margin: 0; }
/* Desktop only: hide the photo below 1025px so it never crowds the text. */
@media (max-width: 1024px) {
  body.mig-warm .mig-guests-cta-band { min-height: 0; padding: 56px 0; display: block; }
  body.mig-warm .mig-guests-cta-band__img,
  body.mig-warm .mig-guests-cta-band__veil { display: none; }
}
@media (max-width: 767px) {
  body.mig-warm .mig-guests-cta-band { padding: 40px 0; }
  body.mig-warm .mig-guests-cta-band__inner { padding-block: 0; }
}

/* #TR2-B3 (Samuel 2026-06-09): guest sidebar made STATIC. The base theme pins it with
   position:sticky (theme.css ~5027), but the sidebar is both shorter than the article AND
   taller than the viewport, so it froze mid-scroll then released at a content-dependent point
   (different per page) — read as a bug. Static = it scrolls naturally; the CTA is still served
   by the top-of-sidebar card + the pre-footer CTA band. Warm-scoped override (base untouched). */
body.mig-warm .mig-guests__sidebar { position: static; }

/* #TR2-4 — footer "Using my photos" (menu item 99992): full label on desktop,
   short "Photo policy" on mobile so it never wraps. Inactive span display:none =
   one label in the a11y tree. */
body.mig-warm .mig-menu-lbl-short { display: none; }
@media (max-width: 767px) {
  body.mig-warm .mig-menu-lbl-full  { display: none; }
  body.mig-warm .mig-menu-lbl-short { display: inline; }
}

/* === SEO-GEO R-14 (2026-06-10) — listing-card tag chips =======
   The chip row is a sibling <nav> after each card <a> (theme.css R-14).
   Under Warm Host the regular/search cards are flush cream boxes, so the
   row CONTINUES the box: cream fill + side/bottom borders + the bottom
   radius, while the card gives up its bottom edge via :has(). The hover
   lift carries the row along so the box doesn't shear apart. Chips stay
   AA-safe via the existing RS-02 chip override (cream fill + border). */
body.mig-warm .mig-post-card:has(+ .mig-tag-chips--card) {
  border-bottom: 0;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
body.mig-warm .mig-post-card + .mig-tag-chips--card {
  background: var(--mh-cream);
  border: 1px solid var(--wh-bd);
  border-top: 0;
  border-radius: 0 0 var(--wh-r) var(--wh-r);
  box-shadow: var(--wh-shadow-sm);
  margin: 0;
  padding-bottom: 22px;
  transition: transform .25s ease;
}
body.mig-warm .mig-post-card:hover + .mig-tag-chips--card { transform: translateY(-4px); }
/* the featured card has no warm box — keep its chip row plain on the sand,
   closing the featured section with the same hairline the card gave up */
body.mig-warm .mig-post-card--featured + .mig-tag-chips--card {
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--mh-rule);
}
@media (prefers-reduced-motion: reduce) {
  body.mig-warm .mig-post-card + .mig-tag-chips--card { transition: none; }
  body.mig-warm .mig-post-card:hover + .mig-tag-chips--card { transform: none; }
}

/* === SEO-GEO R-29 (2026-06-10) — listing-card gallery thumb strip ===
   Sibling <div> after card <a> → chips <nav> (theme.css R-29). Under Warm
   Host the strip CONTINUES the regular card's cream box: it takes the
   bottom edge (radius + side borders) from whichever sibling held it, and
   the hover lift carries it along so the box doesn't shear apart. Featured
   cards have no warm box — their strip stays plain on the sand and closes
   the group with the same hairline the chips row gave up. */
body.mig-warm .mig-post-card:has(+ .mig-card-strip) {
  border-bottom: 0;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
body.mig-warm .mig-post-card + .mig-tag-chips--card:has(+ .mig-card-strip) {
  border-bottom: 0;
  border-radius: 0;
  padding-bottom: 14px;
}
body.mig-warm .mig-post-card + .mig-card-strip,
body.mig-warm .mig-post-card + .mig-tag-chips--card + .mig-card-strip {
  background: var(--mh-cream);
  border: 1px solid var(--wh-bd);
  border-top: 0;
  border-radius: 0 0 var(--wh-r) var(--wh-r);
  box-shadow: var(--wh-shadow-sm);
  margin: 0;
  padding-bottom: 22px;
  transition: transform .25s ease;
}
body.mig-warm .mig-post-card:hover + .mig-card-strip,
body.mig-warm .mig-post-card:hover + .mig-tag-chips--card + .mig-card-strip { transform: translateY(-4px); }
/* featured: plain on the sand; the strip closes the group with the hairline */
body.mig-warm .mig-post-card--featured + .mig-tag-chips--card:has(+ .mig-card-strip) {
  border-bottom: 0;
  padding-bottom: 14px;
}
body.mig-warm .mig-post-card--featured + .mig-card-strip,
body.mig-warm .mig-post-card--featured + .mig-tag-chips--card + .mig-card-strip {
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--mh-rule);
}
/* QA9 desktop thumb inset (Samuel, 2026-06-11 — "too tight to the left"): the list
   cards kept the pre-warm divider-row geometry (vertical padding only), so the thumb
   touched the cream box's left edge. Uniform 20px inset on desktop; the sibling
   chips/strip alignment offsets gain the same 20px so the columns stay lined up. */
@media (min-width: 601px) {
  body.mig-warm .mig-post-card:not(.mig-search-card) { padding: 20px; }
  body.mig-warm .mig-post-card:not(.mig-search-card) + .mig-tag-chips--card { padding-left: calc(20px + 180px + 28px); padding-right: 20px; }
  body.mig-warm .mig-post-card:not(.mig-search-card) + .mig-card-strip,
  body.mig-warm .mig-post-card:not(.mig-search-card) + .mig-tag-chips--card + .mig-card-strip { padding-left: calc(20px + 180px + 28px); padding-right: 20px; }
}
/* QA9 B9 (Samuel's iPhone pass, 2026-06-11): under Warm Host the card→chips→strip
   group became one closed cream box but kept the OLD divider-list spacing model
   (none) — groups sat flush against each other, and the strip's bottom border read
   as "a faint line on top of the next card". Give every group-ender real air,
   whichever element closes the group. */
body.mig-warm .mig-post-card + .mig-card-strip,
body.mig-warm .mig-post-card + .mig-tag-chips--card + .mig-card-strip,
body.mig-warm .mig-post-card--featured + .mig-card-strip,
body.mig-warm .mig-post-card--featured + .mig-tag-chips--card + .mig-card-strip { margin-bottom: 28px; }
body.mig-warm .mig-post-card + .mig-tag-chips--card:not(:has(+ .mig-card-strip)),
body.mig-warm .mig-post-card--featured + .mig-tag-chips--card:not(:has(+ .mig-card-strip)) { margin-bottom: 28px; }
body.mig-warm .mig-post-card:not(:has(+ .mig-tag-chips--card)):not(:has(+ .mig-card-strip)),
body.mig-warm .mig-post-card--featured:not(:has(+ .mig-tag-chips--card)):not(:has(+ .mig-card-strip)) { margin-bottom: 28px; }

@media (prefers-reduced-motion: reduce) {
  body.mig-warm .mig-post-card + .mig-card-strip,
  body.mig-warm .mig-post-card + .mig-tag-chips--card + .mig-card-strip { transition: none; }
  body.mig-warm .mig-post-card:hover + .mig-card-strip,
  body.mig-warm .mig-post-card:hover + .mig-tag-chips--card + .mig-card-strip { transform: none; }
}

/* === SEO-GEO R-21 / T2 (2026-06-10) — mobile text inset inside the warm card box ===
   At ≤600px the regular card's grid goes 1-col (theme.css), and because the card
   only has vertical padding (28px 0) the title/dek/byline sat flush against the
   cream box's left/right edges. Inset the TEXT column 20px — the kit's established
   mobile card inset (search-card body: 16px 20px 20px; search chips row: 20px) —
   while the thumbnail stays full-bleed (same media-bleed/text-inset pattern as the
   search + related cards). The sibling chips row + thumb strip visually continue
   the same cream box, so they move by the SAME 20px. Warm-scoped: with the toggle
   off the cards are plain rows on the page background and flush-left is correct.
   :not(.mig-search-card) everywhere — search cards share the .mig-post-card class
   and already carry their own 20px inset (don't double-pad). The featured card has
   no warm box (plain on the sand) and stays at the page gutter — untouched. */
@media (max-width: 600px) {
  body.mig-warm .mig-post-card:not(.mig-search-card) .mig-post-card__inner > div:last-child { padding: 0 20px; }
  body.mig-warm .mig-post-card:not(.mig-search-card) + .mig-tag-chips--card { padding-left: 20px; padding-right: 20px; }
  body.mig-warm .mig-post-card:not(.mig-search-card) + .mig-card-strip,
  body.mig-warm .mig-post-card:not(.mig-search-card) + .mig-tag-chips--card + .mig-card-strip { padding-left: 20px; padding-right: 20px; }
  /* QA9 (Samuel, 2026-06-11, his screenshot): the card's 28px top padding left a cream
     strip ABOVE the thumbnail — bleed the image to the card's top edge (the exp/itin
     image-on-top pattern): no top padding, image top corners take the card radius. */
  body.mig-warm .mig-post-card:not(.mig-search-card) { padding-top: 0; }
  body.mig-warm .mig-post-card:not(.mig-search-card) .mig-post-card__inner img {
    border-radius: var(--wh-r) var(--wh-r) 0 0;
  }
}

/* ── Newsletter (Jetpack subscribe) status messages — size + colour. The theme
   never styled these, so they inherited an oversized font. Short, on-state
   colour. Copy rewritten in mu-plugin mig-newsletter-copy.php. Added 2026-06-14. */
body.mig-warm .jetpack_subscription_widget .success,
body.mig-warm .jetpack_subscription_widget .error,
body.mig-warm .jetpack_subscription_widget p {
  font-size: .9rem;
  line-height: 1.45;
  margin: 0 0 8px;
}
body.mig-warm .jetpack_subscription_widget .success,
body.mig-warm .jetpack_subscription_widget .success p { color: #2E5339; }
body.mig-warm .jetpack_subscription_widget p.error,
body.mig-warm .jetpack_subscription_widget .error { color: #7C2A1F; }
body.mig-warm .jetpack_subscription_widget a { color: var(--accent, #984C34); text-decoration: underline; }

/* ── End-of-article newsletter band (single.php). Centred band after the post,
   before "More from the Blog"; mirrors the sidebar form treatment. 2026-06-14. */
body.mig-warm .mig-article-subscribe {
  max-width: 620px; margin: 44px auto 8px; padding: 26px 28px 28px;
  background: var(--mh-sand, #F3EBDD); border: 1px solid var(--mh-rule-strong, #e3d8c6);
  border-radius: var(--wh-r-sm, 10px); text-align: center;
}
body.mig-warm .mig-article-subscribe__eyebrow {
  font-family: var(--font-body); font-size: var(--t-caption); font-weight: 600;
  text-transform: uppercase; letter-spacing: var(--tracking-wider); color: var(--accent); margin: 0 0 4px;
}
body.mig-warm .mig-article-subscribe__h {
  font-family: var(--font-display, Georgia, "Times New Roman", serif); color: var(--mh-navy);
  font-size: 1.3rem; line-height: 1.2; margin: 0 0 6px;
}
body.mig-warm .mig-article-subscribe__note { font-size: .95rem; color: var(--mh-ink-2); margin: 0 0 16px; }
body.mig-warm .mig-article-subscribe .jetpack_subscription_widget { max-width: 420px; margin: 0 auto; }
body.mig-warm .mig-article-subscribe #subscribe-email { margin: 0 0 10px; }
body.mig-warm .mig-article-subscribe input[type="email"] {
  font-family: var(--font-body) !important; font-size: var(--t-body) !important; color: var(--mh-ink) !important;
  background: var(--mh-cream) !important; border: 1px solid var(--mh-rule-strong) !important;
  border-radius: var(--wh-r-sm) !important; padding: 0.7rem 0.9rem !important; width: 100% !important;
  box-sizing: border-box !important; box-shadow: none !important;
}
body.mig-warm .mig-article-subscribe input[type="email"]:focus {
  outline: none !important; border-color: var(--mh-navy) !important; box-shadow: 0 0 0 3px rgba(26,43,76,0.12) !important;
}
body.mig-warm .mig-article-subscribe .wp-block-button__link {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 100% !important;
  font-family: var(--font-body) !important; font-size: var(--t-caption) !important; font-weight: 600 !important;
  text-transform: uppercase !important; letter-spacing: var(--tracking-wider) !important; color: var(--mh-cream) !important;
  background: var(--accent) !important; border: 1.5px solid transparent !important; border-radius: var(--wh-r-btn) !important;
  padding: 0.7rem 1.5rem !important; margin: 0 !important; cursor: pointer !important; box-shadow: none !important;
  transition: background var(--dur-fast) var(--ease-out-expo) !important;
}
body.mig-warm .mig-article-subscribe .wp-block-button__link:hover { background: var(--accent-press) !important; }
@media (max-width: 560px){ body.mig-warm .mig-article-subscribe { margin: 32px 0 8px; padding: 22px 18px 24px; } }

/* ── Desktop ToC-rail sign-up (under the Contents). Compact, in the sticky right
   rail; replaces the disconnected end-of-article band on desktop. 2026-06-14. */
body.mig-warm .mig-toc__subscribe { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--mh-rule-strong, #e3d8c6); }
body.mig-warm .mig-toc__subscribe-eyebrow { font-size: var(--t-micro); font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--mh-terracotta); margin: 0 0 6px; }
body.mig-warm .mig-toc__subscribe-h { font-family: var(--font-body); color: var(--mh-ink-2); font-size: .85rem; line-height: 1.3; margin: 0 0 10px; }
body.mig-warm .mig-toc__subscribe #subscribe-email { margin: 0 0 8px; }
body.mig-warm .mig-toc__subscribe input[type="email"] {
  font-family: var(--font-body) !important; font-size: .85rem !important; color: var(--mh-ink) !important;
  background: var(--mh-cream) !important; border: 1px solid var(--mh-rule-strong) !important; border-radius: var(--wh-r-sm) !important;
  padding: .55rem .7rem !important; width: 100% !important; box-sizing: border-box !important; box-shadow: none !important;
}
body.mig-warm .mig-toc__subscribe input[type="email"]:focus { outline: none !important; border-color: var(--mh-navy) !important; box-shadow: 0 0 0 3px rgba(26,43,76,0.12) !important; }
body.mig-warm .mig-toc__subscribe .wp-block-button__link {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 100% !important;
  font-family: var(--font-body) !important; font-size: .72rem !important; font-weight: 600 !important; text-transform: uppercase !important;
  letter-spacing: var(--tracking-wider) !important; color: var(--mh-cream) !important; background: var(--accent) !important;
  border: 1.5px solid transparent !important; border-radius: var(--wh-r-btn) !important; padding: .55rem 1rem !important; margin: 0 !important;
  cursor: pointer !important; box-shadow: none !important;
}
body.mig-warm .mig-toc__subscribe .wp-block-button__link:hover { background: var(--accent-press) !important; }
@media (min-width: 1200px){ body.mig-warm .mig-article-subscribe--has-rail { display: none; } }

/* ── Phase 4: mobile CTA consistency. Guests + Itineraries section CTAs go
   full-width at ≤900px to match Blog + Contact (which already do). Matches
   the .mh-homecta__cta treatment. Samuel-approved 2026-06-14. */
@media (max-width: 900px){
  body.mig-warm .mh-home-guests__foot .btn,
  body.mig-warm .mh-experiences__pricing--cta-only .btn { width: 100%; text-align: center; }
  body.mig-warm .mh-experiences__pricing--cta-only { align-items: stretch; }
}


/* Fix 2026-06-15 (Samuel): first home journal card had padding-left:0, so on the Warm Host hover-lift its text
   touched the card edge. Match it to cards 2 & 3. Desktop only (>=901px); on mobile the cards stack flush. */
@media (min-width: 901px){
  body.mig-warm .mh-journal__entry:first-child{ padding-left: 32px; }
}


/* Fix 2026-06-15 (Samuel): on mobile the post comment block (DISCUSSION + Leave a comment) was left-aligned between two
   centred bands. Centre it on mobile; keep the actual comment form left-aligned. */
@media (max-width:900px){
  body.mig-warm .mig-comments{ text-align:center; }
  body.mig-warm .mig-comments__note,
  body.mig-warm .comment-form-comment,
  body.mig-warm .mig-comments__form-details form{ text-align:left; }
}