/* ---------- Sections ---------- */
/* Sections are full-width group blocks. Astra centres direct children of the content
   area; these rules make a section span the page and leave centring to .kb-wrap. */
.entry-content > .kb-hero, .entry-content > .kb-sec, .entry-content > .kb-trust, .entry-content > .kb-cta-band,
.kb-hero, .kb-sec, .kb-trust, .kb-cta-band {
  box-sizing: border-box;
  width: 100%;
  max-width: none !important;
  margin: 0 !important;
}
.kb-sec { padding: 72px 0; background: #fff; color: var(--kb-body); }
.kb-sec--cream { background: var(--kb-cream); }
.kb-sec > .kb-wrap > :first-child, .kb-hero .kb-wrap > :first-child { margin-top: 0; }

.kb-eyebrow {
  font-family: var(--kb-font-mono); font-size: 11px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase;
  color: var(--kb-gold-ink); margin: 0 0 14px;
}
.kb-sec h2, .kb-cta-band h2 {
  font-family: var(--kb-font-head); font-weight: 700; font-size: clamp(25px, 3vw, 34px); line-height: 1.14; letter-spacing: -.02em;
  color: var(--kb-ink); max-width: 22ch; margin: 0;
}
.kb-lead { font-size: 17px; line-height: 1.6; color: var(--kb-body); max-width: 56ch; margin: 14px 0 0; }

/* ---------- Buttons (core button blocks with a class) ---------- */
.kb-btn-gold .wp-block-button__link, .kb-btn-line .wp-block-button__link, .kb-btn-dark .wp-block-button__link {
  display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 24px;
  border-radius: 10px; border: 1px solid transparent; font-family: var(--kb-font-body); font-size: 15px; font-weight: 700; line-height: 1.2;
  text-decoration: none; transition: transform .16s, box-shadow .16s, background .16s, border-color .16s, color .16s;
}
.kb-btn-gold .wp-block-button__link, .kb-btn-gold .wp-block-button__link:visited { background: var(--kb-gold); color: var(--kb-navy); }
.kb-btn-gold .wp-block-button__link:hover, .kb-btn-gold .wp-block-button__link:focus { background: var(--kb-gold-hover); color: var(--kb-navy); transform: translateY(-2px); box-shadow: 0 12px 26px rgba(229, 178, 60, .3); }
.kb-btn-line .wp-block-button__link, .kb-btn-line .wp-block-button__link:visited { background: transparent; border-color: var(--kb-line-dark); color: var(--kb-ink-light); }
.kb-btn-line .wp-block-button__link:hover, .kb-btn-line .wp-block-button__link:focus { background: transparent; border-color: var(--kb-gold); color: var(--kb-gold); }
.kb-btn-dark .wp-block-button__link, .kb-btn-dark .wp-block-button__link:visited { background: transparent; border-color: var(--kb-line); color: var(--kb-ink); }
.kb-btn-dark .wp-block-button__link:hover, .kb-btn-dark .wp-block-button__link:focus { background: transparent; border-color: var(--kb-gold-ink); color: var(--kb-gold-ink); }
.wp-block-buttons.kb-buttons { display: flex; flex-wrap: wrap; gap: 12px; margin: 28px 0 0; }

/* ---------- Hero (navy) ---------- */
.kb-hero {
  padding: 68px 0 62px; color: var(--kb-ink-light);
  background: radial-gradient(55% 70% at 85% 0%, rgba(229, 178, 60, .16), transparent 62%), var(--kb-navy);
}
.kb-hero__grid { display: grid; grid-template-columns: 1.25fr 1fr; gap: 44px; align-items: center; }
.kb-hero .kb-eyebrow { color: var(--kb-gold); }
.kb-hero h1 {
  font-family: var(--kb-font-head); font-weight: 800; font-size: clamp(33px, 4.6vw, 52px); line-height: 1.05; letter-spacing: -.025em;
  color: #fff; max-width: 16ch; margin: 0;
}
.kb-hero h1 em { font-style: normal; color: var(--kb-gold); }
.kb-hero .kb-lead { color: #C3CBD9; }
.kb-panel { background: var(--kb-card-dark); border: 1px solid var(--kb-line-dark); border-radius: 18px; padding: 26px; }
.kb-panel .kb-eyebrow { color: var(--kb-gold); }
.kb-panel ol { list-style: none; counter-reset: kb-step; margin: 0; padding: 0; }
.kb-panel li { counter-increment: kb-step; position: relative; padding-left: 40px; margin: 0 0 14px; font-size: 15px; line-height: 1.5; color: #C3CBD9; }
.kb-panel li:last-child { margin-bottom: 0; }
.kb-panel li::before {
  content: counter(kb-step); position: absolute; left: 0; top: 0; width: 26px; height: 26px; border-radius: 50%;
  border: 1.5px solid var(--kb-gold); color: var(--kb-gold); font-family: var(--kb-font-head); font-size: 12.5px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}

/* ---------- Trust strip ---------- */
.kb-trust { background: #fff; border-bottom: 1px solid var(--kb-line); padding: 22px 0; }
.kb-trust__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.kb-trust__item p { margin: 0; font-size: 13.5px; color: var(--kb-body); }
.kb-trust__item p:first-child { font-family: var(--kb-font-head); font-weight: 700; font-size: 15px; color: var(--kb-ink); }
.kb-stars { display: block; color: var(--kb-gold-ink); font-size: 18px; line-height: 1.25; letter-spacing: 3px; }
/* Links in the strip keep a 44px tap height without making the strip taller than its text needs. */
.kb-trust__item a { display: inline-flex; align-items: center; min-height: 44px; margin: -12px 0; color: var(--kb-gold-ink); text-decoration: underline; text-underline-offset: 3px; }
.kb-trust__item a:hover, .kb-trust__item a:focus { color: var(--kb-ink); }

/* ---------- Cards ---------- */
.kb-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 36px; }
.kb-card {
  background: #fff; border: 1px solid var(--kb-line); border-radius: 16px; padding: 24px; margin: 0 !important;
  transition: transform .2s, border-color .2s, box-shadow .2s;
}
.kb-card:hover { transform: translateY(-3px); border-color: var(--kb-gold); box-shadow: 0 16px 34px rgba(26, 31, 40, .08); }
.kb-card::before {
  content: ""; display: block; width: 38px; height: 38px; border-radius: 10px; margin-bottom: 14px;
  background: radial-gradient(circle at 50% 50%, transparent 0 6px, var(--kb-gold-ink) 6px 7.5px, transparent 7.5px), linear-gradient(140deg, #FBF1DA, #F0DFB4);
}
.kb-card h3 { font-family: var(--kb-font-head); font-weight: 600; font-size: 17px; color: var(--kb-ink); margin: 0 0 5px; }
.kb-card p { font-size: 14.5px; line-height: 1.55; color: var(--kb-body); margin: 0; }

/* ---------- Towns ---------- */
.kb-towns { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 24px 0 0; padding: 0; }
.kb-towns li { background: #fff; border: 1px solid var(--kb-line); border-radius: 20px; padding: 5px 13px; font-size: 14px; color: var(--kb-ink); margin: 0; }
.kb-note { font-size: 15px; color: var(--kb-body); max-width: 56ch; margin: 18px 0 0; }

/* ---------- FAQ (core details blocks) ---------- */
.kb-faq { margin-top: 28px; border-top: 1px solid var(--kb-line); }
.kb-faq details { border-bottom: 1px solid var(--kb-line); margin: 0; }
.kb-faq summary {
  cursor: pointer; list-style: none; position: relative; min-height: 48px; padding: 16px 44px 16px 0;
  font-family: var(--kb-font-head); font-weight: 600; font-size: 17px; color: var(--kb-ink);
}
.kb-faq summary::-webkit-details-marker { display: none; }
.kb-faq summary::after { content: "+"; position: absolute; right: 6px; top: 12px; font-size: 24px; font-weight: 400; color: var(--kb-gold-ink); }
.kb-faq details[open] summary::after { content: "\2013"; }
.kb-faq details p { margin: 0; padding: 0 44px 20px 0; font-size: 16px; line-height: 1.6; color: var(--kb-body); }

/* ---------- Closing band (navy) ---------- */
.kb-cta-band {
  padding: 76px 0; text-align: center; color: var(--kb-ink-light);
  background: radial-gradient(60% 90% at 50% 0%, rgba(229, 178, 60, .14), transparent 68%), var(--kb-navy);
}
.kb-cta-band .kb-eyebrow { color: var(--kb-gold); }
.kb-cta-band h2 { color: #fff; margin: 0 auto; }
.kb-cta-band .kb-lead { color: #C3CBD9; margin: 14px auto 0; }
.kb-cta-band .wp-block-buttons.kb-buttons { justify-content: center; }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  .kb-hero__grid { grid-template-columns: 1fr; gap: 30px; }
  .kb-cards { grid-template-columns: 1fr 1fr; }
  .kb-trust__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
  .kb-sec { padding: 54px 0; }
  .kb-hero { padding: 48px 0 46px; }
  .kb-cards { grid-template-columns: 1fr; }
  .wp-block-buttons.kb-buttons .wp-block-button { width: 100%; }
  .wp-block-buttons.kb-buttons .wp-block-button__link { width: 100%; }
}

/* ---------- Recently sold ---------- */
.kb-sold-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; margin-top: 36px; }
.kb-sold {
  background: #fff; border: 1px solid var(--kb-line); border-radius: 16px; overflow: hidden;
  box-shadow: 0 6px 16px rgba(26, 31, 40, .05); transition: transform .2s, border-color .2s;
}
.kb-sold:hover, .kb-sold:focus-within { transform: translateY(-4px); border-color: var(--kb-gold); }
.kb-sold__photo { position: relative; display: block; width: 100%; aspect-ratio: 1; overflow: hidden; background: #0B0A14; }
button.kb-sold__photo { border: 0; border-radius: 0; padding: 0; margin: 0; cursor: pointer; font: inherit; color: inherit; }
/* The card clips its contents, so the focus ring is drawn inside the photo. */
#page button.kb-sold__photo:focus-visible { outline: 3px solid var(--kb-gold); outline-offset: -5px; }
.kb-sold__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
/* A landscape photo (a cased set) is shown whole, never cropped. */
.kb-sold__photo.is-wide img { object-fit: contain; }
.kb-sold__back { opacity: 0; transition: opacity .35s; }
.kb-sold__photo[aria-pressed="true"] .kb-sold__back { opacity: 1; }
/* Hover preview only where a real pointer can hover, so it never sticks after a tap. */
@media (hover: hover) { .kb-sold__photo:hover .kb-sold__back { opacity: 1; } }
.kb-sold__badge {
  position: absolute; top: 10px; left: 10px; padding: 3px 10px; border-radius: 20px;
  background: rgba(10, 14, 22, .88); color: var(--kb-gold);
  font-family: var(--kb-font-mono); font-size: 11px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase;
}
.kb-sold__hint {
  position: absolute; right: 8px; bottom: 8px; padding: 2px 9px; border-radius: 20px;
  background: rgba(10, 14, 22, .78); color: #fff; font-size: 13px;
}
.kb-sold__body { padding: 14px 16px 16px; }
.kb-sold__label { font-family: var(--kb-font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--kb-body); margin: 0 0 3px; }
.kb-sold h3 { font-family: var(--kb-font-head); font-weight: 600; font-size: 15.5px; line-height: 1.3; color: var(--kb-ink); margin: 0 0 5px; }
.kb-sold__caption { font-size: 14px; line-height: 1.5; color: var(--kb-body); margin: 0; }

@media (max-width: 1000px) { .kb-sold-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 600px) { .kb-sold-grid { grid-template-columns: 1fr 1fr; gap: 10px; } }

/* WordPress adds a top margin to every block after the first inside a group. In our grids
   the "blocks" are side-by-side columns, so that margin would push all but the first down. */
.kb-trust__grid > *, .kb-hero__grid > *, .kb-cards > * { margin-block-start: 0 !important; }

/* Astra pads top-level blocks sideways; on these sections the gutter belongs to .kb-wrap alone. */
#content .entry-content > .kb-hero, #content .entry-content > .kb-trust, #content .entry-content > .kb-sec,
#content .entry-content > .kb-cta-band { padding-left: 0; padding-right: 0; }

/* ---------- Card symbols: one per card, chosen in the pattern by a kb-i-* class ---------- */
.kb-card.kb-i-coins::before { background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%238A6714%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cellipse%20cx%3D%2212%22%20cy%3D%227%22%20rx%3D%227%22%20ry%3D%223%22%2F%3E%3Cpath%20d%3D%22M5%207v5c0%201.7%203.1%203%207%203s7-1.3%207-3V7%22%2F%3E%3Cpath%20d%3D%22M5%2012v5c0%201.7%203.1%203%207%203s7-1.3%207-3v-5%22%2F%3E%3C%2Fsvg%3E") center / 22px 22px no-repeat, linear-gradient(140deg, #FBF1DA, #F0DFB4); }
.kb-card.kb-i-bars::before { background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%238A6714%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M8%208h8l3.5%209h-15z%22%2F%3E%3Cpath%20d%3D%22M9.5%2012.5h5%22%2F%3E%3C%2Fsvg%3E") center / 22px 22px no-repeat, linear-gradient(140deg, #FBF1DA, #F0DFB4); }
.kb-card.kb-i-case::before { background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%238A6714%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223.5%22%20y%3D%226%22%20width%3D%2217%22%20height%3D%2212%22%20rx%3D%222%22%2F%3E%3Ccircle%20cx%3D%229%22%20cy%3D%2212%22%20r%3D%222.4%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2212%22%20r%3D%222.4%22%2F%3E%3C%2Fsvg%3E") center / 22px 22px no-repeat, linear-gradient(140deg, #FBF1DA, #F0DFB4); }
.kb-card.kb-i-album::before { background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%238A6714%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%225%22%20y%3D%223.5%22%20width%3D%2214%22%20height%3D%2217%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M9%203.5v17%22%2F%3E%3Ccircle%20cx%3D%2214%22%20cy%3D%229%22%20r%3D%221.7%22%2F%3E%3Ccircle%20cx%3D%2214%22%20cy%3D%2215%22%20r%3D%221.7%22%2F%3E%3C%2Fsvg%3E") center / 22px 22px no-repeat, linear-gradient(140deg, #FBF1DA, #F0DFB4); }
.kb-card.kb-i-home::before { background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%238A6714%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2011l8-6.5%208%206.5%22%2F%3E%3Cpath%20d%3D%22M6.5%2010v9.5h11V10%22%2F%3E%3Cpath%20d%3D%22M10.5%2019.5v-5h3v5%22%2F%3E%3C%2Fsvg%3E") center / 22px 22px no-repeat, linear-gradient(140deg, #FBF1DA, #F0DFB4); }
.kb-card.kb-i-camera::before { background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%238A6714%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%208.5h3l1.5-2.5h7L17%208.5h3v10H4z%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2213.2%22%20r%3D%223.1%22%2F%3E%3C%2Fsvg%3E") center / 22px 22px no-repeat, linear-gradient(140deg, #FBF1DA, #F0DFB4); }
.kb-card.kb-i-check::before { background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%238A6714%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%228.5%22%2F%3E%3Cpath%20d%3D%22M8.2%2012.3l2.6%202.6%204.9-5.3%22%2F%3E%3C%2Fsvg%3E") center / 22px 22px no-repeat, linear-gradient(140deg, #FBF1DA, #F0DFB4); }
.kb-card.kb-i-clock::before { background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%238A6714%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%228.5%22%2F%3E%3Cpath%20d%3D%22M12%207.5V12l3%202%22%2F%3E%3C%2Fsvg%3E") center / 22px 22px no-repeat, linear-gradient(140deg, #FBF1DA, #F0DFB4); }
.kb-card.kb-i-person::before { background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%238A6714%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%228.5%22%20r%3D%223.5%22%2F%3E%3Cpath%20d%3D%22M5%2019.5c1-3.6%203.8-5.5%207-5.5s6%201.9%207%205.5%22%2F%3E%3C%2Fsvg%3E") center / 22px 22px no-repeat, linear-gradient(140deg, #FBF1DA, #F0DFB4); }
.kb-basket { position: relative; display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; color: var(--kb-ink-light); }
.kb-basket__count { position: absolute; top: 4px; right: 2px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px; background: var(--kb-gold); color: var(--kb-navy); font-size: 11px; font-weight: 700; line-height: 18px; text-align: center; }
