/* ============================================================
   LUXURY REVIEWS — Additional CSS — Editorial Upgrade (Full Replace)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@100;200;300;400&family=Lora:ital,wght@0,400;0,500;1,400&display=swap');

/* ─────────────────────────────────────────────
   GLOBAL REFINEMENT
   ───────────────────────────────────────────── */

body {
  background-color: #0F0E0B !important;
}

.wp-block-group {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

@media (max-width: 768px) {
  .wp-block-group {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }
}

.wp-block-post,
.wp-block-group,
.wp-block-cover {
  border-radius: 0 !important;
}

.wp-block-post-content {
  max-width: 720px;
  margin: 0 auto;
}

/* ── SITE HEADER ── */
.wp-block-template-part header,
.site-header,
header .wp-block-group {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
  min-height: unset !important;
}

header nav a {
  letter-spacing: 0.15em !important;
  font-size: 13px !important;
}

header nav a.current-menu-item {
  border-bottom: 1px solid #D4BA8A !important;
}

/* ── SITE TITLE ── */
.site-title, .site-title a {
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 100 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: #F5F0E8 !important;
}

/* ── ALL HEADINGS ── */
h1, h2, h3, h4, h5, h6,
.wp-block-heading,
.wp-block-query-title,
nav, .main-navigation a {
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 300 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  line-height: 1.3 !important;
}

.wp-block-cover h1,
.wp-block-cover h2,
.wp-block-cover h3,
.wp-block-cover .wp-block-heading {
  letter-spacing: 0.04em !important;
  line-height: 1.15 !important;
}

/* ── BODY TEXT ── */
p, li, .entry-summary,
.wp-block-post-excerpt__excerpt {
  font-family: 'Lora', serif !important;
  font-weight: 400 !important;
  line-height: 1.75 !important;
}

/* ── POST TITLE ── */
.wp-block-post-title,
.wp-block-post-title a {
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 300 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: #F5F0E8 !important;
  font-size: clamp(1.6rem, 3vw, 2.4rem) !important;
  line-height: 1.25 !important;
  margin-bottom: 2rem !important;
  border-top: 1px solid #B49A6A !important;
  padding-top: 1.8rem !important;
}

body.single .wp-block-post-title,
body.single .wp-block-post-title a {
  color: #1A1814 !important;
}

body.single .wp-block-post-title {
  max-width: 720px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

/* ── CONTENT HEADINGS ── */
.entry-content h2,
.entry-content h3 {
  font-size: 1.1rem !important;
  letter-spacing: 0.18em !important;
  color: #D4BA8A !important;
  border-bottom: 1px solid rgba(180,154,106,0.4) !important;
}

body.single .entry-content h2,
body.single .entry-content h3,
body.page:not(.home) .entry-content h2,
body.page:not(.home) .entry-content h3 {
  color: #6B4E1F !important;
  border-bottom-color: rgba(107,78,31,0.5) !important;
}

.wp-block-query .wp-block-post-title {
  font-size: 1.25rem !important;
  letter-spacing: 0.08em !important;
}

.wp-block-post {
  margin-bottom: 2.2rem !important;
  transition: opacity 0.3s ease;
}

.wp-block-post:hover {
  opacity: 0.85;
}

.wp-block-post-excerpt p {
  color: rgba(245,240,232,0.6) !important;
}

.section-label {
  font-family: 'Josefin Sans', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.25em;
  font-size: 11px;
  color: #B49A6A;
  margin-bottom: 18px;
}

/* ── BUTTONS ── */
.wp-block-button__link,
.wp-element-button {
  font-family: 'Josefin Sans', sans-serif !important;
  background-color: transparent !important;
  color: #D4BA8A !important;
  border: 1px solid #D4BA8A !important;
  padding: 0.7em 1.6em !important;
  text-transform: uppercase !important;
  letter-spacing: 0.15em !important;
  font-size: 0.75rem !important;
}

.wp-block-button__link:hover {
  background-color: #D4BA8A !important;
  color: #0F0E0B !important;
}

body.page:not(.home) .entry-content,
body.single .entry-content {
  background-color: #F5F0E8 !important;
  color: #3A3630 !important;
}

.wp-caption-text {
  font-size: 0.85rem !important;
  color: rgba(43,43,43,0.6) !important;
}

/* ─────────────────────────────────────────────
   FOOTER
   ───────────────────────────────────────────── */

.site-footer {
  background-color: #0F0E0B !important;
  border-top: 1px solid #B49A6A !important;
}

.site-footer .wp-block-site-title {
  letter-spacing: 0.3em !important;
  font-size: 0.7rem !important;
  color: #E8D09A !important;
}

.site-footer p {
  font-size: 0.65rem !important;
  letter-spacing: 0.12em !important;
  color: rgba(245,240,232,0.5) !important;
}

.site-footer a {
  color: #D4BA8A !important;
}

.site-footer a:hover {
  color: #F5F0E8 !important;
}

.wp-block-social-link svg {
  fill: #B49A6A !important;
}

.wp-block-social-link:hover svg {
  fill: #F5F0E8 !important;
}

/* ── SUBSCRIBE BLOCK ── */
.wp-block-jetpack-subscriptions {
  background-color: #171510 !important;
  border: 1px solid rgba(180,154,106,0.2) !important;
  padding: 2rem !important;
  max-width: 520px !important;
  margin: 0 auto !important;
}

.wp-block-jetpack-subscriptions input[type="email"] {
  background: transparent !important;
  border-bottom: 1px solid rgba(180,154,106,0.4) !important;
  color: #F5F0E8 !important;
}

.wp-block-jetpack-subscriptions button {
  font-size: 0.7rem !important;
}

@media (max-width: 768px) {
  .wp-block-post-title {
    font-size: 1.4rem !important;
    letter-spacing: 0.05em !important;
  }
  .wp-block-post-content {
    max-width: 92% !important;
  }
}

/* ─────────────────────────────────────────────
   HOMEPAGE PILLAR TILES
   ───────────────────────────────────────────── */

body.home .wp-block-columns {
  gap: 12px !important;
  margin-top: 12px !important;
  margin-bottom: 12px !important;
}

body.home .wp-block-columns .wp-block-cover {
  min-height: 460px !important;
  padding: 3rem 2rem !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
}

body.home .wp-block-columns .wp-block-cover .wp-block-cover__inner-container {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 1.8rem !important;
  width: 100% !important;
  max-width: 100% !important;
}

body.home .wp-block-columns .wp-block-cover .wp-block-cover__inner-container .wp-block-heading,
body.home .wp-block-columns .wp-block-cover .wp-block-cover__inner-container h2 {
  text-align: center !important;
  margin: 0 !important;
}

body.home .wp-block-columns .wp-block-cover .wp-block-buttons {
  justify-content: center !important;
  margin: 0 !important;
}

@media (max-width: 768px) {
  body.home .wp-block-columns {
    gap: 8px !important;
    margin-top: 8px !important;
    margin-bottom: 8px !important;
  }
  body.home .wp-block-columns .wp-block-cover {
    min-height: 320px !important;
    padding: 2rem 1.5rem !important;
  }
}

/* ─────────────────────────────────────────────
   HOMEPAGE HERO — IMAGE FILLS COLUMN
   ───────────────────────────────────────────── */

body.home .wp-block-cover .wp-block-columns > .wp-block-column {
  display: flex !important;
  flex-direction: column !important;
}

body.home .wp-block-cover .wp-block-columns .wp-block-column .wp-block-image {
  height: 100% !important;
  margin: 0 !important;
}

body.home .wp-block-cover .wp-block-columns .wp-block-column .wp-block-image figure,
body.home .wp-block-cover .wp-block-columns .wp-block-column .wp-block-image img {
  height: 100% !important;
  width: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

/* ─────────────────────────────────────────────
   PHASE 1A — FINAL POLISH
   ───────────────────────────────────────────── */

body.home main > .wp-block-cover,
body.home .wp-site-blocks > main > .wp-block-cover,
body.home .wp-site-blocks > .wp-block-cover {
  margin-bottom: 0 !important;
}

body.home main > .wp-block-cover + .wp-block-columns,
body.home .wp-site-blocks > main > .wp-block-cover + .wp-block-columns,
body.home .wp-site-blocks > .wp-block-cover + .wp-block-columns {
  margin-top: 0 !important;
}

body.home main > .wp-block-cover h1,
body.home main > .wp-block-cover h2,
body.home main > .wp-block-cover .wp-block-heading,
body.home .wp-site-blocks > main > .wp-block-cover h1,
body.home .wp-site-blocks > main > .wp-block-cover h2,
body.home .wp-site-blocks > main > .wp-block-cover .wp-block-heading {
  font-size: clamp(1.7rem, 3.2vw, 2.6rem) !important;
  line-height: 1.15 !important;
  letter-spacing: 0.03em !important;
}

.site-footer,
footer.wp-block-template-part,
.wp-site-blocks > footer {
  padding-top: 2rem !important;
  padding-bottom: 2rem !important;
}

.site-footer .wp-block-group,
footer.wp-block-template-part .wp-block-group,
.wp-site-blocks > footer .wp-block-group {
  padding-top: 0.6rem !important;
  padding-bottom: 0.6rem !important;
}

/* ─────────────────────────────────────────────
   PHASE 1B / 1C — LATEST POSTS QUERY LOOP & HEADING
   The H2 "THE LATEST POSTS" is treated as a proper editorial
   section signpost — large, light cream, left-aligned within
   the same 1200px content column as the cards beneath, with
   a thin gold horizontal rule anchoring the section. This
   replaces the earlier muted centred treatment, matching the
   "WORTH YOUR ATTENTION THIS WEEK" pattern from the in-house
   design mockup that Paul approved.
   ───────────────────────────────────────────── */

/* (a) Section heading — large, cream, left-aligned */
body.home main > .wp-block-heading,
body.home .wp-site-blocks > main > .wp-block-heading {
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 200 !important;
  font-size: clamp(1.8rem, 3.5vw, 2.8rem) !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  color: #F5F0E8 !important;
  text-align: left !important;
  max-width: 1200px !important;
  margin: 3rem auto 0 auto !important;
  padding: 0 2rem !important;
  border: none !important;
  line-height: 1.15 !important;
  position: relative !important;
}

/* Small gold caps editorial lead-in above the heading.
   Matches the "— THE DEALS" / "— THE REVIEWS" pattern from the
   in-house design mockup that Paul approved. The em-dash is part
   of the visual treatment, sitting at the baseline before the label
   text. To change the label text in future, edit the `content` 
   value below ("— THE LATEST" → whatever) — the rest of the
   typography stays consistent. */
body.home main > .wp-block-heading::before {
  content: '— THE LATEST' !important;
  display: block !important;
  font-family: 'Josefin Sans', sans-serif !important;
  font-size: 0.75rem !important;
  font-weight: 300 !important;
  letter-spacing: 0.3em !important;
  color: #D4BA8A !important;
  margin: 0 0 1rem 0 !important;
  text-transform: uppercase !important;
  background: none !important;
  height: auto !important;
  width: auto !important;
  vertical-align: baseline !important;
  opacity: 1 !important;
}

/* Trailing pseudo-element no longer used in the new pattern —
   the gold rule below the heading is delivered by the Query Loop
   ::before in section (b) instead. */
body.home main > .wp-block-heading::after {
  display: none !important;
  content: none !important;
}

/* (b) Query Loop container — constrained to 1200px content column,
   with a thin gold rule above it acting as the section divider
   beneath the heading. */
body.home .wp-block-query {
  max-width: 1200px !important;
  margin: 0 auto 4rem auto !important;
  padding: 0 2rem !important;
  position: relative !important;
}

body.home .wp-block-query::before {
  content: '' !important;
  display: block !important;
  height: 1px !important;
  background: rgba(180,154,106,0.5) !important;
  margin: 1.8rem 0 3rem 0 !important;
}

/* (c) Post Template grid — 3 columns desktop, regardless of editor.
   Two posts fill two slots; third slot stays empty until a third
   review publishes (Crystal Cruises, La Mamounia). */
body.home .wp-block-post-template {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 2.5rem 2rem !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* (d) Individual post cards — editorial unit with faint gold border */
body.home .wp-block-post-template .wp-block-post {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 1px solid rgba(180,154,106,0.15) !important;
  display: flex !important;
  flex-direction: column !important;
  transition: transform 0.3s ease, opacity 0.3s ease !important;
}

body.home .wp-block-post-template .wp-block-post:hover {
  transform: translateY(-3px) !important;
  opacity: 0.95 !important;
  border-color: rgba(180,154,106,0.35) !important;
}

/* (e) Featured image — 1:1 square crop, flush to top of card,
   position:relative required for the gold hover overlay below. */
body.home .wp-block-post-template .wp-block-post-featured-image {
  margin: 0 !important;
  overflow: hidden !important;
  aspect-ratio: 1 / 1 !important;
  position: relative !important;
}

body.home .wp-block-post-template .wp-block-post-featured-image::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: rgba(180,154,106,0) !important;
  transition: background 0.5s ease !important;
  pointer-events: none !important;
  z-index: 2 !important;
}

body.home .wp-block-post-template .wp-block-post:hover .wp-block-post-featured-image::after {
  background: rgba(180,154,106,0) !important;
}

body.home .wp-block-post-template .wp-block-post-featured-image img,
body.home .wp-block-post-template .wp-block-post-featured-image a {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}

body.home .wp-block-post-template .wp-block-post-featured-image img {
  object-fit: cover !important;
  object-position: center !important;
  transition: transform 0.6s ease !important;
}

body.home .wp-block-post-template .wp-block-post:hover .wp-block-post-featured-image img {
  transform: scale(1.04) !important;
}

/* (f) Post date — sits below title, separated by a gold rule.
   flex layout creates the date-left / READ →-right bottom row
   without needing a Read More block in the Post Template.
   order:3 pushes it below the title (order:2). */
body.home .wp-block-post-template .wp-block-post-date {
  order: 3 !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  border-top: 1px solid rgba(180,154,106,0.2) !important;
  padding: 0.75rem 1rem 1rem 1rem !important;
  margin: auto 0 0 0 !important;
}

body.home .wp-block-post-template .wp-block-post-date::after {
  content: 'READ →' !important;
  font-family: 'Josefin Sans', sans-serif !important;
  font-size: 0.6rem !important;
  font-weight: 300 !important;
  letter-spacing: 0.22em !important;
  color: #D4BA8A !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  flex-shrink: 0 !important;
  transition: color 0.2s ease !important;
}

body.home .wp-block-post-template .wp-block-post:hover .wp-block-post-date::after {
  color: #F5F0E8 !important;
}

body.home .wp-block-post-template .wp-block-post-date time,
body.home .wp-block-post-template .wp-block-post-date a {
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 300 !important;
  font-size: 0.65rem !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: #B49A6A !important;
  text-decoration: none !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* (g) Post title — hairline weight, padded inside bordered card,
   order:2 places it above the date row (order:3). */
body.home .wp-block-post-template .wp-block-post-title,
body.home .wp-block-post-template .wp-block-post-title a {
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 100 !important;
  font-size: 1.1rem !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  line-height: 1.35 !important;
  color: #F5F0E8 !important;
  padding: 1rem 1rem 0.4rem 1rem !important;
  margin: 0 !important;
  border: none !important;
  text-align: left !important;
  text-decoration: none !important;
  order: 2 !important;
  transition: color 0.3s ease !important;
}

body.home .wp-block-post-template .wp-block-post:hover .wp-block-post-title,
body.home .wp-block-post-template .wp-block-post:hover .wp-block-post-title a {
  color: #D4BA8A !important;
}

body.home .wp-block-post-template .wp-block-post-title a:hover {
  color: #D4BA8A !important;
}

/* (h) Tablet — 2 columns */
@media (min-width: 769px) and (max-width: 1024px) {
  body.home .wp-block-post-template {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* (i) Mobile — single column, smaller heading,
   tighter spacing for the rule and grid */
@media (max-width: 768px) {
  body.home main > .wp-block-heading {
    font-size: 1.5rem !important;
    letter-spacing: 0.04em !important;
    margin: 3rem auto 0 auto !important;
    padding: 0 1rem !important;
  }
  body.home main > .wp-block-heading::before {
    font-size: 0.6rem !important;
    letter-spacing: 0.25em !important;
    margin-bottom: 0.7rem !important;
  }
  body.home .wp-block-query {
    padding: 0 1rem !important;
    margin-bottom: 3rem !important;
  }
  body.home .wp-block-query::before {
    margin: 1.2rem 0 2rem 0 !important;
  }
  body.home .wp-block-post-template {
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
  }
}

/* ─────────────────────────────────────────────
   PHASE 1C — BLOCK EDITOR TITLE VISIBILITY
   The global .wp-block-post-title rule sets cream for front-end
   visibility against the dark page background. Inside the block
   editor's iframe, that cream renders against a white/cream editor
   surface — invisible. These rules force the title dark inside any
   editor context, leaving front-end styling untouched.

   Coverage caveat: WordPress.com may not load Additional CSS into
   the editor iframe at all. If these selectors don't resolve the
   issue, the fix has to come via theme.json, a plugin, or a 
   different mechanism. Either way the front-end stays unaffected.
   ───────────────────────────────────────────── */

.editor-styles-wrapper .wp-block-post-title,
.editor-styles-wrapper .wp-block-post-title a,
.editor-styles-wrapper h1.wp-block-post-title,
.editor-styles-wrapper h2.wp-block-post-title,
.editor-styles-wrapper .editor-post-title,
.editor-styles-wrapper .editor-post-title__input,
.editor-styles-wrapper .editor-post-title__block,
.block-editor-block-list__layout .wp-block-post-title,
.block-editor-block-list__layout .wp-block-post-title a,
.block-editor-page .wp-block-post-title,
.wp-admin .editor-post-title,
.wp-admin .editor-post-title__input,
body.block-editor-page .wp-block-post-title,
.interface-interface-skeleton__content .wp-block-post-title,
.interface-interface-skeleton__content .editor-post-title {
  color: #1A1814 !important;
  -webkit-text-fill-color: #1A1814 !important;
}

/* ─────────────────────────────────────────────
   PHASE 1C — CATEGORY / ARCHIVE PAGES
   When a reader clicks "VIEW ALL" on a homepage tile, they hit
   /category/[slug]/. The archive landing must feel like the same
   publication as the homepage — same content column, same card
   language, same gold rule beneath the heading. Without this,
   navigating from the editorial homepage into the archive feels
   like landing on a different site.

   Targets body.archive (covers all category pages: Reviews,
   Hotels, Trains, Flights, etc.) plus body.category and 
   body.search for safety.
   ───────────────────────────────────────────── */

/* (a) Archive page heading — same editorial weight as homepage
   Latest Posts: large light cream Josefin Sans, left-aligned,
   constrained to 1200px content column. Targets every common
   archive title block name to catch theme variations. */
body.archive .wp-block-query-title,
body.archive .wp-block-archive-title,
body.archive .wp-block-term-title,
body.category .wp-block-query-title,
body.category .wp-block-archive-title,
body.archive main > .wp-block-heading,
body.archive main h1.wp-block-heading,
body.archive .wp-site-blocks > main h1,
body.archive .wp-site-blocks > main .wp-block-query-title {
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 200 !important;
  font-size: clamp(1.8rem, 3.5vw, 2.8rem) !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  color: #F5F0E8 !important;
  text-align: left !important;
  max-width: 1200px !important;
  margin: 4rem auto 0 auto !important;
  padding: 0 2rem !important;
  border: none !important;
  line-height: 1.15 !important;
}

/* (b) Hide archive descriptions / theme decorations that produce
   the tan-strip artefact between heading and post grid. If the
   category genuinely needs a description in future, override this
   selectively. */
body.archive .wp-block-term-description,
body.archive .wp-block-archive-description,
body.archive .archive-description,
body.archive .term-description,
body.archive .wp-block-post-template + .wp-block-cover:empty,
body.archive .wp-block-cover.is-light:not(.has-background-image),
body.category .wp-block-term-description,
body.category .archive-description {
  display: none !important;
}

/* (c) Query Loop on archives — match the homepage container width
   and add the same thin gold rule between heading and post grid. */
body.archive .wp-block-query,
body.category .wp-block-query {
  max-width: 1200px !important;
  margin: 0 auto 4rem auto !important;
  padding: 0 2rem !important;
  position: relative !important;
}

body.archive .wp-block-query::before,
body.category .wp-block-query::before {
  content: '' !important;
  display: block !important;
  height: 1px !important;
  background: rgba(180,154,106,0.5) !important;
  margin: 1.8rem 0 3rem 0 !important;
}

/* (d) Post Template grid — 3 columns desktop, 2 tablet, 1 mobile.
   Same dimensions as homepage Latest Posts so the visual language
   is consistent across pages. */
body.archive .wp-block-post-template,
body.category .wp-block-post-template {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 2.5rem 2rem !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* (e) Individual post cards on archive pages — same bordered editorial unit as homepage */
body.archive .wp-block-post-template .wp-block-post,
body.category .wp-block-post-template .wp-block-post {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 1px solid rgba(180,154,106,0.15) !important;
  display: flex !important;
  flex-direction: column !important;
  transition: transform 0.3s ease, opacity 0.3s ease !important;
}

body.archive .wp-block-post-template .wp-block-post:hover,
body.category .wp-block-post-template .wp-block-post:hover {
  transform: translateY(-3px) !important;
  opacity: 0.95 !important;
  border-color: rgba(180,154,106,0.35) !important;
}

/* (f) Featured image — 1:1 square crop, flush to top of card */
body.archive .wp-block-post-template .wp-block-post-featured-image,
body.category .wp-block-post-template .wp-block-post-featured-image {
  margin: 0 !important;
  overflow: hidden !important;
  aspect-ratio: 1 / 1 !important;
  position: relative !important;
}

body.archive .wp-block-post-template .wp-block-post-featured-image::after,
body.category .wp-block-post-template .wp-block-post-featured-image::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: rgba(180,154,106,0) !important;
  transition: background 0.5s ease !important;
  pointer-events: none !important;
  z-index: 2 !important;
}

body.archive .wp-block-post-template .wp-block-post:hover .wp-block-post-featured-image::after,
body.category .wp-block-post-template .wp-block-post:hover .wp-block-post-featured-image::after {
  background: rgba(180,154,106,0) !important;
}

body.archive .wp-block-post-template .wp-block-post-featured-image img,
body.archive .wp-block-post-template .wp-block-post-featured-image a,
body.category .wp-block-post-template .wp-block-post-featured-image img,
body.category .wp-block-post-template .wp-block-post-featured-image a {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}

body.archive .wp-block-post-template .wp-block-post-featured-image img,
body.category .wp-block-post-template .wp-block-post-featured-image img {
  object-fit: cover !important;
  object-position: center !important;
  transition: transform 0.6s ease !important;
}

body.archive .wp-block-post-template .wp-block-post:hover .wp-block-post-featured-image img,
body.category .wp-block-post-template .wp-block-post:hover .wp-block-post-featured-image img {
  transform: scale(1.04) !important;
}

/* (g) Post date on archive cards — flex row with date left, READ → right */
body.archive .wp-block-post-template .wp-block-post-date,
body.category .wp-block-post-template .wp-block-post-date {
  order: 3 !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  border-top: 1px solid rgba(180,154,106,0.2) !important;
  padding: 0.75rem 1rem 1rem 1rem !important;
  margin: auto 0 0 0 !important;
}

body.archive .wp-block-post-template .wp-block-post-date::after,
body.category .wp-block-post-template .wp-block-post-date::after {
  content: 'READ →' !important;
  font-family: 'Josefin Sans', sans-serif !important;
  font-size: 0.6rem !important;
  font-weight: 300 !important;
  letter-spacing: 0.22em !important;
  color: #D4BA8A !important;
  text-transform: uppercase !important;
  flex-shrink: 0 !important;
  transition: color 0.2s ease !important;
}

body.archive .wp-block-post-template .wp-block-post:hover .wp-block-post-date::after,
body.category .wp-block-post-template .wp-block-post:hover .wp-block-post-date::after {
  color: #F5F0E8 !important;
}

body.archive .wp-block-post-template .wp-block-post-date time,
body.archive .wp-block-post-template .wp-block-post-date a,
body.category .wp-block-post-template .wp-block-post-date time,
body.category .wp-block-post-template .wp-block-post-date a {
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 300 !important;
  font-size: 0.65rem !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: #B49A6A !important;
  margin: 0 !important;
  text-decoration: none !important;
  border: none !important;
  padding: 0 !important;
}

/* (h) Post title on archive cards — hairline weight, padded inside bordered card,
   order:2 places it above the date row (order:3). */
body.archive .wp-block-post-template .wp-block-post-title,
body.archive .wp-block-post-template .wp-block-post-title a,
body.category .wp-block-post-template .wp-block-post-title,
body.category .wp-block-post-template .wp-block-post-title a {
  font-family: 'Josefin Sans', sans-serif !important;
  font-weight: 100 !important;
  font-size: 1.1rem !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  line-height: 1.35 !important;
  color: #F5F0E8 !important;
  padding: 1rem 1rem 0.4rem 1rem !important;
  margin: 0 !important;
  border: none !important;
  text-align: left !important;
  text-decoration: none !important;
  order: 2 !important;
  transition: color 0.3s ease !important;
}

body.archive .wp-block-post-template .wp-block-post-title a:hover,
body.category .wp-block-post-template .wp-block-post-title a:hover {
  color: #D4BA8A !important;
}

/* (i) Post excerpt on archive cards — Lora serif at small size,
   muted cream, clamped to ~3 lines so cards stay even-height. 
   Without this, longer excerpts make some cards much taller than
   others and the grid loses rhythm. */
body.archive .wp-block-post-template .wp-block-post-excerpt,
body.category .wp-block-post-template .wp-block-post-excerpt {
  margin: 0.8rem 0 0 0 !important;
}

body.archive .wp-block-post-template .wp-block-post-excerpt__excerpt,
body.archive .wp-block-post-template .wp-block-post-excerpt p,
body.category .wp-block-post-template .wp-block-post-excerpt__excerpt,
body.category .wp-block-post-template .wp-block-post-excerpt p {
  font-family: 'Lora', serif !important;
  font-size: 0.85rem !important;
  line-height: 1.6 !important;
  color: rgba(245,240,232,0.55) !important;
  margin: 0 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

/* (j) Hide the WordPress default "Read more" suffix on the excerpt;
   the card itself is the link, no extra CTA needed. */
body.archive .wp-block-post-template .wp-block-post-excerpt__more-text,
body.archive .wp-block-post-template .wp-block-post-excerpt__more-link,
body.category .wp-block-post-template .wp-block-post-excerpt__more-text,
body.category .wp-block-post-template .wp-block-post-excerpt__more-link {
  display: none !important;
}

/* (k) Pagination at the bottom of the archive — style discreetly */
body.archive .wp-block-query-pagination,
body.category .wp-block-query-pagination {
  max-width: 1200px !important;
  margin: 3rem auto 0 auto !important;
  padding: 2rem 2rem 0 2rem !important;
  border-top: 1px solid rgba(180,154,106,0.3) !important;
  display: flex !important;
  justify-content: center !important;
  gap: 1rem !important;
}

body.archive .wp-block-query-pagination a,
body.archive .wp-block-query-pagination .wp-block-query-pagination-numbers,
body.category .wp-block-query-pagination a,
body.category .wp-block-query-pagination .wp-block-query-pagination-numbers {
  font-family: 'Josefin Sans', sans-serif !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: #B49A6A !important;
  text-decoration: none !important;
}

body.archive .wp-block-query-pagination a:hover,
body.category .wp-block-query-pagination a:hover {
  color: #F5F0E8 !important;
}

/* (l) Tablet — 2 columns */
@media (min-width: 769px) and (max-width: 1024px) {
  body.archive .wp-block-post-template,
  body.category .wp-block-post-template {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* (m) Mobile — 1 column, smaller heading, tighter spacing */
@media (max-width: 768px) {
  body.archive .wp-block-query-title,
  body.archive .wp-block-archive-title,
  body.archive main h1,
  body.category .wp-block-query-title {
    font-size: 1.5rem !important;
    margin: 3rem auto 0 auto !important;
    padding: 0 1rem !important;
  }
  body.archive .wp-block-query,
  body.category .wp-block-query {
    padding: 0 1rem !important;
    margin-bottom: 3rem !important;
  }
  body.archive .wp-block-query::before,
  body.category .wp-block-query::before {
    margin: 1.2rem 0 2rem 0 !important;
  }
  body.archive .wp-block-post-template,
  body.category .wp-block-post-template {
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
  }
}

/* ─────────────────────────────────────────────
   PHASE 1C — PILLAR TILE HOVER STATES
   The four pillar tiles on the homepage (Reviews / Deals / Edit /
   Captain) sit static in their default state. Adding a subtle 
   image zoom + overlay deepening + button colour fill on hover
   makes them feel intentional and responsive to interaction —
   like real navigation cards rather than placeholder posters.
   ───────────────────────────────────────────── */

body.home .wp-block-columns .wp-block-cover {
  overflow: hidden !important;
  transition: all 0.4s ease !important;
}

/* Image zoom — subtle 6% scale so it reads as motion without 
   tipping into theatre */
body.home .wp-block-columns .wp-block-cover .wp-block-cover__image-background,
body.home .wp-block-columns .wp-block-cover img.wp-block-cover__image-background {
  transition: transform 0.7s ease !important;
  will-change: transform !important;
}

body.home .wp-block-columns .wp-block-cover:hover .wp-block-cover__image-background,
body.home .wp-block-columns .wp-block-cover:hover img.wp-block-cover__image-background {
  transform: scale(1.06) !important;
}

/* Slight overlay deepening on hover so the tile name stays legible
   against the zoomed image */
body.home .wp-block-columns .wp-block-cover .wp-block-cover__background,
body.home .wp-block-columns .wp-block-cover span[aria-hidden="true"] {
  transition: opacity 0.4s ease !important;
}

body.home .wp-block-columns .wp-block-cover:hover .wp-block-cover__background,
body.home .wp-block-columns .wp-block-cover:hover span[aria-hidden="true"] {
  opacity: 0.85 !important;
}

/* The VIEW ALL button — flips from outlined to filled gold on tile
   hover, signalling clearly this is the primary action */
body.home .wp-block-columns .wp-block-cover .wp-block-button__link {
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease !important;
}

body.home .wp-block-columns .wp-block-cover:hover .wp-block-button__link {
  background-color: #D4BA8A !important;
  color: #0F0E0B !important;
  border-color: #D4BA8A !important;
}

/* ─────────────────────────────────────────────
   PHASE 1C — COOKIE BANNER (WPConsent)
   The default WPConsent banner uses a yellow Accept button and 
   white outlined Reject/Preferences — visually it shouts "this is
   a third-party plugin" rather than belonging to the site. These
   rules restyle it to the editorial palette: dark panel, gold
   accent, Josefin Sans buttons.

   Caveat: WPConsent class names vary by version; selectors below
   cast a wide net. If something doesn't catch, send me a screenshot
   of the banner with browser dev tools open (right-click banner →
   Inspect Element) and I'll narrow them.
   ───────────────────────────────────────────── */

/* Banner panel — dark editorial surface with gold top rule */
.wpc-banner,
.wpconsent-banner,
.wpconsent-banner-wrap,
#wpconsent-banner,
.cookie-notice,
[class*="wpconsent-banner"]:not([class*="button"]):not([class*="content"]),
[class*="wpc-banner"]:not([class*="button"]):not([class*="content"]) {
  background-color: #0F0E0B !important;
  border-top: 1px solid #B49A6A !important;
  font-family: 'Lora', serif !important;
  color: #F5F0E8 !important;
  padding: 1.4rem 2rem !important;
  box-shadow: 0 -4px 24px rgba(0,0,0,0.4) !important;
}

/* Banner body text */
.wpc-banner-content,
.wpconsent-banner-content,
.wpconsent-banner-text,
.wpc-banner p,
.wpconsent-banner p,
[class*="wpconsent"] .banner-text,
[class*="wpc-banner"] p {
  font-family: 'Lora', serif !important;
  font-size: 0.85rem !important;
  color: rgba(245,240,232,0.8) !important;
  line-height: 1.6 !important;
  margin: 0 0 0.8rem 0 !important;
}

/* Base button styling — applied to every WPConsent button */
.wpc-button,
.wpconsent-button,
.wpconsent-banner button,
.wpc-banner button,
[class*="wpconsent-btn"],
[class*="wpc-btn"] {
  font-family: 'Josefin Sans', sans-serif !important;
  font-size: 0.7rem !important;
  font-weight: 300 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  padding: 0.7em 1.6em !important;
  border-radius: 0 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  margin: 0 0.4rem 0 0 !important;
}

/* Reject + Preferences buttons — outlined gold */
.wpc-button-reject,
.wpc-button-preferences,
.wpconsent-button-reject,
.wpconsent-button-preferences,
[class*="reject"][class*="button"],
[class*="reject"][class*="btn"],
[class*="preferences"][class*="button"],
[class*="preferences"][class*="btn"],
[class*="button-reject"],
[class*="btn-reject"],
[class*="button-preferences"],
[class*="btn-preferences"] {
  background-color: transparent !important;
  color: #D4BA8A !important;
  border: 1px solid #D4BA8A !important;
}

.wpc-button-reject:hover,
.wpc-button-preferences:hover,
[class*="button-reject"]:hover,
[class*="button-preferences"]:hover {
  background-color: rgba(212,186,138,0.1) !important;
  color: #F5F0E8 !important;
  border-color: #F5F0E8 !important;
}

/* Accept All — primary action, filled gold */
.wpc-button-accept,
.wpc-button-accept-all,
.wpconsent-button-accept,
.wpconsent-button-accept-all,
[class*="accept-all"],
[class*="accept_all"],
[class*="button-accept"],
[class*="btn-accept"] {
  background-color: #D4BA8A !important;
  color: #0F0E0B !important;
  border: 1px solid #D4BA8A !important;
}

.wpc-button-accept:hover,
.wpc-button-accept-all:hover,
[class*="accept-all"]:hover,
[class*="button-accept"]:hover {
  background-color: #B49A6A !important;
  border-color: #B49A6A !important;
}

/* Hide the "WPConsent" branding badge if it shows on the banner */
.wpc-branding,
.wpconsent-branding,
[class*="wpc-branding"],
[class*="wpconsent-branding"],
[class*="powered-by"] {
  display: none !important;
}

/* Mobile — buttons stack with a small gap */
@media (max-width: 600px) {
  .wpc-banner,
  .wpconsent-banner,
  [class*="wpconsent-banner"],
  [class*="wpc-banner"] {
    padding: 1rem 1.2rem !important;
  }
  .wpc-button,
  .wpconsent-button,
  [class*="wpconsent-btn"],
  [class*="wpc-btn"] {
    margin: 0.3rem 0.3rem 0 0 !important;
    padding: 0.6em 1.2em !important;
    font-size: 0.65rem !important;
  }
}

/* ─────────────────────────────────────────────
   PHASE 1D — CATEGORY BADGES ON POST CARDS
   A Post Terms (Categories) block sits between Featured Image 
   and Post Date inside the Post Template. These rules lift it 
   out of the normal document flow and anchor it absolutely over 
   the top-left corner of the featured image — so the category 
   badge ("HOTELS", "TRAINS" etc.) reads as part of the image 
   rather than as a text line below it. Matches the editorial 
   post-card mockup Paul approved.
   Applied on homepage feed AND category archive pages.
   ───────────────────────────────────────────── */

/* (a) Card wrapper must be position:relative so the badge
   anchors relative to the card, not the viewport.
   Already set in Phase 1B; restated here for the archive context. */
body.home .wp-block-post-template .wp-block-post,
body.archive .wp-block-post-template .wp-block-post,
body.category .wp-block-post-template .wp-block-post {
  position: relative !important;
}

/* (b) Badge container — absolutely positioned top-left of card,
   which visually reads as top-left of the featured image since
   the image is the first element in the card. Stack badges
   vertically so multi-category posts don't wrap horizontally. */
body.home .wp-block-post-template .wp-block-post-terms,
body.archive .wp-block-post-template .wp-block-post-terms,
body.category .wp-block-post-template .wp-block-post-terms {
  position: absolute !important;
  top: 1rem !important;
  left: 1rem !important;
  z-index: 10 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.35rem !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* (c) Category separator between multiple terms — hidden.
   Each category gets its own badge via the flex column above. */
body.home .wp-block-post-template .wp-block-post-terms__separator,
body.archive .wp-block-post-template .wp-block-post-terms__separator,
body.category .wp-block-post-template .wp-block-post-terms__separator {
  display: none !important;
}

/* (d) Individual badge link */
body.home .wp-block-post-template .wp-block-post-terms a,
body.archive .wp-block-post-template .wp-block-post-terms a,
body.category .wp-block-post-template .wp-block-post-terms a {
  font-family: 'Josefin Sans', sans-serif !important;
  font-size: 0.68rem !important;
  font-weight: 300 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: #D4BA8A !important;
  background: rgba(15,14,11,0.88) !important;
  border: 1px solid #D4BA8A !important;
  padding: 0.35em 0.9em !important;
  text-decoration: none !important;
  display: inline-block !important;
  line-height: 1.4 !important;
  transition: background 0.2s ease, color 0.2s ease !important;
  backdrop-filter: blur(2px) !important;
}

body.home .wp-block-post-template .wp-block-post-terms a:hover,
body.archive .wp-block-post-template .wp-block-post-terms a:hover,
body.category .wp-block-post-template .wp-block-post-terms a:hover {
  background: #D4BA8A !important;
  color: #0F0E0B !important;
}

/* (e) Hide the parent "The Reviews" category badge so only the
   specific child (Hotels, Trains etc.) shows on each card.
   Selector targets any category link whose URL ends in /reviews/
   — safe because child categories (/hotels/, /trains/ etc.) 
   don't end with that string. */
body.home .wp-block-post-template .wp-block-post-terms a[href$="/reviews/"],
body.archive .wp-block-post-template .wp-block-post-terms a[href$="/reviews/"],
body.category .wp-block-post-template .wp-block-post-terms a[href$="/reviews/"] {
  display: none !important;
}