/* TWB v3 — homepage.css
   Dual-spine made visible, with refinement-pass treatments:
   - Money & Movement as a live utility instrument
   - Sunday Intelligence with premium gravity
   - Back Home with rhythm and breathing room
   - Pulse without clutter (colour accents, micro-rhythm markers)
   - Stronger functional typography hierarchy
   - Mobile-first card pacing
*/

.home-section { margin: 0 0 2.5rem; }
.home-section__title {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 0 0 .9rem;
  padding-bottom: .4rem;
  border-bottom: 2px solid var(--tw-ink);
}
.home-section__kicker {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--tw-muted);
  margin: 0 0 .35rem;
}
.home-section__dek {
  font-family: 'Source Serif 4', Georgia, serif;
  font-style: italic;
  color: var(--tw-dek);
  font-size: 1rem;
  margin: 0 0 1rem;
}
.home-section__more {
  margin: 1rem 0 0;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .9rem;
  font-weight: 600;
}
.home-section__more a { text-decoration: none; }
.home-section__more a:hover { text-decoration: underline; }

/* ----------------------------------------------------------------------
   Dual-spine above-the-fold.
   ---------------------------------------------------------------------- */
.home-dual-spine {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  margin-bottom: 2rem;
}
@media (min-width: 900px) {
  .home-dual-spine { grid-template-columns: 3fr 2fr; gap: 2.5rem; }
}

/* The Five Decisions tiles — Spine A */
.home-five__grid {
  list-style: none;
  padding: 0;
  margin: .25rem 0 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: .9rem;
}
@media (min-width: 600px) {
  .home-five__grid { grid-template-columns: 1fr 1fr; }
}

.tile {
  display: block;
  text-decoration: none;
  color: inherit;
  padding: 1.1rem 1.1rem 1.2rem;
  background: var(--tw-cream);
  border: 1px solid var(--tw-rule);
  border-radius: var(--tw-radius);
  position: relative;
  transition: border-color .15s ease, transform .15s ease;
}
.tile::before {
  /* Subtle Spine A accent — pulse without clutter */
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: var(--tw-spine-a);
  border-radius: var(--tw-radius) 0 0 var(--tw-radius);
  opacity: .75;
}
.tile:hover {
  border-color: var(--tw-ink);
  transform: translateY(-1px);
}
.tile__label {
  display: block;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tw-spine-a);
  margin-bottom: .4rem;
}
.tile__hed {
  display: block;
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1.15rem;
  font-weight: 600;
  line-height: 1.25;
  color: var(--tw-ink);
  margin-bottom: .4rem;
}
.tile__sub {
  display: block;
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: .95rem;
  color: var(--tw-dek);
  line-height: 1.45;
}
.tile__sub em { color: var(--tw-muted); font-style: italic; }

/* ----------------------------------------------------------------------
   From Back Home — Spine B with rhythm.
   ---------------------------------------------------------------------- */
.home-back-home { background: transparent; }

.back-home-featured {
  padding: 1.1rem 0 1.3rem;
  border-bottom: 1px solid var(--tw-rule-soft);
  margin-bottom: 1.4rem;
  position: relative;
}
.back-home-featured::before {
  /* Spine B pulse accent */
  content: "";
  position: absolute;
  left: 0; top: 1.4rem;
  width: 32px; height: 2px;
  background: var(--tw-spine-b);
  opacity: .8;
}
.back-home-featured__kicker {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tw-spine-b);
  margin: 0 0 .5rem;
  padding-left: 44px;
}
.back-home-featured__hed {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1.35rem;
  font-weight: 600;
  line-height: 1.25;
  margin: 0 0 .45rem;
}
.back-home-featured__hed a {
  color: var(--tw-ink);
  text-decoration: none;
}
.back-home-featured__hed a:hover { color: var(--tw-spine-b); }
.back-home-featured__dek {
  font-family: 'Source Serif 4', Georgia, serif;
  font-style: italic;
  color: var(--tw-dek);
  font-size: 1rem;
  margin: 0;
  line-height: 1.45;
}

.back-home-list__kicker {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tw-spine-b);
  margin: 0 0 .75rem;
}
.back-home-items {
  list-style: none;
  padding: 0;
  margin: 0 0 1rem;
}
.back-home-item {
  padding: .75rem 0 .85rem;
  border-bottom: 1px dotted var(--tw-rule);
}
.back-home-item:last-child { border-bottom: 0; }
.back-home-item a {
  display: block;
  text-decoration: none;
  color: inherit;
}
.back-home-item__hed {
  display: block;
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1.05rem;
  font-weight: 500;
  color: var(--tw-ink);
  line-height: 1.3;
  margin-bottom: .2rem;
}
.back-home-item a:hover .back-home-item__hed { color: var(--tw-spine-b); }
.back-home-item__sub {
  display: block;
  font-family: 'Source Serif 4', Georgia, serif;
  font-style: italic;
  font-size: .88rem;
  color: var(--tw-muted);
  line-height: 1.4;
}
.back-home-list__more {
  margin: .75rem 0 0;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .9rem;
  font-weight: 600;
}
.back-home-list__more a { color: var(--tw-spine-b); text-decoration: none; }
.back-home-list__more a:hover { text-decoration: underline; }

/* ----------------------------------------------------------------------
   Today's Signal + Money & Movement supporting band.
   ---------------------------------------------------------------------- */
.home-signal-money {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  margin-bottom: 2.5rem;
}
@media (min-width: 900px) {
  .home-signal-money { grid-template-columns: 3fr 2fr; gap: 2.5rem; }
}

/* Today's Signal — Bloomberg-terminal-brevity with Caribbean emotional weight */
.signal-list {
  list-style: none;
  padding: 0;
  margin: .5rem 0 0;
}
.signal-list li {
  padding: .85rem 0;
  border-bottom: 1px solid var(--tw-rule-soft);
}
.signal-list li:last-child { border-bottom: 0; }
.signal-list a {
  display: block;
  text-decoration: none;
  color: inherit;
}
.signal-list__hed {
  display: block;
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--tw-ink);
  line-height: 1.3;
  margin-bottom: .3rem;
}
.signal-list a:hover .signal-list__hed { color: var(--tw-link); }
.signal-list__implication {
  display: block;
  font-family: 'Source Serif 4', Georgia, serif;
  font-style: italic;
  font-size: .9rem;
  color: var(--tw-dek);
  line-height: 1.4;
}

/* ----------------------------------------------------------------------
   Money & Movement — live utility instrument.
   ---------------------------------------------------------------------- */
.money-card {
  background: #fdf6e8;                /* warm cream-paper card surface */
  border: 1px solid var(--tw-rule);
  border-radius: var(--tw-radius);
  padding: 1.1rem 1.15rem 1.05rem;
  margin: .75rem 0 1.1rem;
  position: relative;
}
.money-card--rates::before {
  /* Spine A accent — same family as the tiles, weaker */
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: var(--tw-spine-a);
  border-radius: var(--tw-radius) 0 0 var(--tw-radius);
  opacity: .55;
}
.money-card__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 .65rem;
}
.money-card__kicker {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tw-ink-soft);
  margin: 0;
}
.money-card__asof {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--tw-muted);
  margin: 0;
}
.money-rates {
  width: 100%;
  border-collapse: collapse;
  font-variant-numeric: tabular-nums;
  margin: 0 0 .65rem;
}
.money-rates tr + tr th,
.money-rates tr + tr td { padding-top: .3rem; }
.money-rates th {
  text-align: left;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--tw-ink-soft);
  padding-right: .6rem;
  width: 1%;
  white-space: nowrap;
}
.money-rates__val {
  font-family: 'Source Serif 4', Georgia, serif;
  font-feature-settings: "tnum" 1, "lnum" 1;
  font-weight: 700;
  font-size: 1.2rem;
  color: var(--tw-ink);
  padding-right: 1.25rem;
}
.money-rates td:last-child { padding-right: 0; }

.money-card__hed {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1.05rem;
  font-weight: 600;
  margin: 0 0 .35rem;
  color: var(--tw-ink);
  line-height: 1.3;
}
.money-card__dek {
  font-family: 'Source Serif 4', Georgia, serif;
  font-style: italic;
  font-size: .92rem;
  color: var(--tw-dek);
  margin: 0 0 .6rem;
  line-height: 1.4;
}
.money-card__cta {
  margin: .3rem 0 0;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .9rem;
  font-weight: 600;
}
.money-card__cta a {
  text-decoration: none;
  color: var(--tw-link);
}
.money-card__cta a:hover { text-decoration: underline; }
.money-card__cta--strong a {
  display: inline-block;
  padding: .45rem .9rem;
  background: var(--tw-spine-a);
  color: var(--tw-cream);
  border-radius: var(--tw-radius);
  font-weight: 700;
  letter-spacing: .02em;
}
.money-card__cta--strong a:hover {
  background: var(--tw-ink);
  text-decoration: none;
}

/* ----------------------------------------------------------------------
   Country grid.
   ---------------------------------------------------------------------- */
.country-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
  margin-top: 1rem;
}
@media (min-width: 720px) {
  .country-grid { grid-template-columns: 3fr 1fr; gap: 2rem; }
}
.country-grid__group-title {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--tw-muted);
  margin: 0 0 .6rem;
}
.country-grid__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .35rem .75rem;
}
@media (min-width: 600px) {
  .country-grid__list { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 900px) {
  .country-grid__list { grid-template-columns: repeat(4, 1fr); }
}
.country-grid__list a {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1rem;
  color: var(--tw-ink);
  text-decoration: none;
  padding: .25rem 0;
  display: inline-block;
}
.country-grid__list a:hover { color: var(--tw-link); text-decoration: underline; }

/* ----------------------------------------------------------------------
   Sunday Intelligence — premium gravity.
   ---------------------------------------------------------------------- */
.home-sunday {
  margin-top: 2.5rem;
}
.sunday-card {
  background: linear-gradient(180deg, #f7eed8 0%, #f1e3c2 100%);
  border: 1px solid #c89a47;
  border-radius: var(--tw-radius);
  padding: 1.6rem 1.5rem 1.4rem;
  position: relative;
  box-shadow: 0 1px 0 rgba(0,0,0,.03);
}
.sunday-card__rule {
  position: absolute;
  left: 1.5rem; top: 0;
  width: 56px; height: 3px;
  background: var(--tw-accent);
  border-radius: 0 0 2px 2px;
}
.sunday-card__kicker {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #6b4a14;
  margin: .25rem 0 .55rem;
}
.sunday-card__title {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1.55rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 0 0 .55rem;
  color: var(--tw-ink);
  line-height: 1.2;
}
@media (min-width: 720px) {
  .sunday-card__title { font-size: 1.8rem; }
}
.sunday-card__dek {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1rem;
  color: #4a3613;
  margin: 0 0 1rem;
  line-height: 1.5;
  max-width: 56ch;
}
.sunday-card__cta {
  margin: .25rem 0 0;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .92rem;
  font-weight: 700;
}
.sunday-card__cta a {
  display: inline-block;
  padding: .55rem 1.1rem;
  background: var(--tw-ink);
  color: var(--tw-cream);
  text-decoration: none;
  border-radius: var(--tw-radius);
  letter-spacing: .02em;
}
.sunday-card__cta a:hover {
  background: var(--tw-spine-b);
}

/* ----------------------------------------------------------------------
   Mobile rhythm — scroll cadence for WhatsApp-heavy diaspora consumption.
   ---------------------------------------------------------------------- */
@media (max-width: 720px) {
  .home-section { margin-bottom: 2rem; }
  .home-section__title { font-size: 1.35rem; }
  .home-dual-spine,
  .home-signal-money { gap: 1.5rem; }
  .tile { padding: .95rem 1rem 1rem; }
  .tile__hed { font-size: 1.05rem; }
  .back-home-featured__hed { font-size: 1.2rem; }
  .back-home-featured__kicker { padding-left: 0; }
  .back-home-featured::before { display: none; }
  .signal-list li { padding: .75rem 0; }
  .signal-list__hed { font-size: 1rem; }
  .money-card { padding: 1rem; }
  .money-rates__val { font-size: 1.05rem; padding-right: .9rem; }
  .sunday-card { padding: 1.25rem 1.15rem 1.15rem; }
  .sunday-card__title { font-size: 1.35rem; }
}
/* From Back Home — structured label treatment for content type + temporal */
.back-home-featured__type {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tw-spine-b);
  margin: 0 0 .15rem;
  padding-left: 44px;
}
.back-home-featured__when {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--tw-muted);
  margin: 0 0 .6rem;
  padding-left: 44px;
}
@media (max-width: 720px) {
  .back-home-featured__type,
  .back-home-featured__when { padding-left: 0; }
}
/* ==========================================================================
   Step 6.6 refinements — behaviour-zone hierarchy, signal rhythm, live pulse
   ========================================================================== */

/* Spine A utility zones — clean ink rule, current default */
.home-five .home-section__title,
.home-money .home-section__title {
  border-bottom: 2px solid var(--tw-ink);
}

/* Today's Signal — finer, two-rule treatment evoking ticker authority */
.home-signal .home-section__title {
  border-bottom: 1px solid var(--tw-ink);
  position: relative;
  padding-bottom: .55rem;
}
.home-signal .home-section__title::after {
  content: "";
  position: absolute;
  left: 0; bottom: -4px;
  width: 32px; height: 1px;
  background: var(--tw-ink);
}

/* Spine B — From Back Home: rule in spine-B brown */
.home-back-home .home-section__title {
  border-bottom: 2px solid var(--tw-spine-b);
}

/* Country grid — quieter, muted rule */
.home-countries .home-section__title {
  border-bottom: 1px solid var(--tw-rule);
  color: var(--tw-ink-soft);
}

/* Today's Signal: stronger headline-to-implication rhythm */
.signal-list li {
  padding: 1rem 0;
}
.signal-list li + li {
  border-top: 1px solid var(--tw-rule-soft);
  border-bottom: 0;
}
.signal-list li:first-child { border-top: 0; }
.signal-list li:last-child  { border-bottom: 0; }

.signal-list__hed {
  font-size: 1.08rem;
  margin-bottom: .35rem;
  letter-spacing: -.005em;
}
.signal-list__implication {
  font-size: .92rem;
  color: var(--tw-ink-soft);
  padding-left: .75rem;
  border-left: 2px solid var(--tw-rule);
  display: block;
}

/* Money card live-pulse — restrained single animated dot */
.money-card__asof {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
}
.money-card__asof::before {
  content: "";
  display: inline-block;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: #4a8c3a;
  box-shadow: 0 0 0 0 rgba(74,140,58, .55);
  animation: twb-pulse 2.4s ease-out infinite;
}
@keyframes twb-pulse {
  0%   { box-shadow: 0 0 0 0   rgba(74,140,58, .55); }
  70%  { box-shadow: 0 0 0 8px rgba(74,140,58, 0); }
  100% { box-shadow: 0 0 0 0   rgba(74,140,58, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .money-card__asof::before { animation: none; }
}

/* Mobile refinement on the new rhythm */
@media (max-width: 720px) {
  .signal-list li { padding: .9rem 0; }
  .signal-list__hed { font-size: 1rem; }
  .signal-list__implication {
    padding-left: .65rem;
    font-size: .88rem;
  }
}
/* ===========================================================================
   Family pillar (home-family) — evolved from home-sw.
   A foundational publication pillar. Equal weight to the geopolitical/economic
   columns, but slower pacing and warmer rhythm. Uses v3 cream/serif idiom.
   =========================================================================== */
.home-family {
  margin: 3rem 0;
  padding: 2rem 1.5rem 2.25rem;
  background: var(--tw-cream);
  border: 1px solid var(--tw-rule);
  border-radius: var(--tw-radius);
}
@media (min-width: 720px) {
  .home-family { padding: 2.5rem 2.25rem 2.75rem; }
}

.home-family__inner {
  max-width: 920px;
  margin: 0 auto;
}

.home-family__head {
  margin: 0 0 2rem;
  max-width: 42em;
}

.home-family__kicker {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tw-ink-soft);
  margin: 0 0 .55rem;
}

.home-family__title {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1.8rem;
  line-height: 1.2;
  margin: 0 0 .85rem;
  color: var(--tw-ink);
}
@media (min-width: 720px) {
  .home-family__title { font-size: 2.1rem; }
}

.home-family__dek {
  font-family: 'Source Serif 4', Georgia, serif;
  font-style: italic;
  font-size: 1.1rem;
  line-height: 1.55;
  color: var(--tw-dek);
  margin: 0;
}

.home-family__layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.75rem;
  align-items: start;
}
@media (min-width: 720px) {
  .home-family__layout {
    grid-template-columns: 180px 1fr;
    gap: 2.25rem;
  }
}

.home-family__cover {
  margin: 0;
}
.home-family__cover img {
  width: 100%;
  max-width: 180px;
  display: block;
  border: 1px solid var(--tw-rule);
  border-radius: var(--tw-radius);
}
.home-family__cover figcaption {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .78rem;
  color: var(--tw-ink-soft);
  margin-top: .55rem;
  max-width: 180px;
  line-height: 1.35;
}
.home-family__cover figcaption strong {
  color: var(--tw-ink);
  font-weight: 600;
}

.home-family__strands {
  min-width: 0;
}

.home-family__strand-list {
  list-style: none;
  margin: 0 0 1.4rem;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: .9rem;
}
@media (min-width: 540px) {
  .home-family__strand-list { grid-template-columns: 1fr 1fr; }
}

.home-family__strand {
  padding: .85rem 1rem;
  background: #fff;
  border: 1px solid var(--tw-rule);
  border-radius: var(--tw-radius);
}

.home-family__strand-name {
  display: block;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .95rem;
  font-weight: 700;
  color: var(--tw-ink);
  margin-bottom: .2rem;
  letter-spacing: .01em;
}

.home-family__strand-note {
  display: block;
  font-family: 'Source Serif 4', Georgia, serif;
  font-style: italic;
  font-size: .92rem;
  line-height: 1.45;
  color: var(--tw-ink-soft);
}

.home-family__note {
  font-family: 'Source Serif 4', Georgia, serif;
  font-style: italic;
  font-size: .98rem;
  color: var(--tw-dek);
  margin: 0 0 1.1rem;
}

.home-family__cta {
  margin: 0;
  font-family: 'Inter', system-ui, sans-serif;
}
.home-family__cta a {
  display: inline-block;
  font-size: .98rem;
  font-weight: 600;
  letter-spacing: .02em;
  color: var(--tw-ink);
  text-decoration: none;
  padding-bottom: 2px;
  border-bottom: 1px solid var(--tw-rule);
  transition: border-color .15s ease;
}
.home-family__cta a:hover {
  border-bottom-color: var(--tw-ink);
}
/* ===========================================================================
   Abigail video tile (sixth decision pillar) + welcome dialog — REFINED
   - Poster-dominant composition; minimal text below
   - Tile height matches the other 5 decision tiles
   - Quiet editorial play affordance (28px outline circle, cream)
   - Soft modal entrance, restrained backdrop
   =========================================================================== */

/* Button must look identical to <a> .tile structurally */
button.tile {
  width: 100%;
  text-align: left;
  font: inherit;
  cursor: pointer;
  font-family: inherit;
}

/* Tile composition: poster dominant, caption secondary.
   Padding zeroed because the poster bleeds to the tile edge. */
.tile--abigail {
  padding: 0 !important; /* override base .tile padding without breaking other tiles */
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
/* Keep the spine accent rail intact even with padding zero */
.tile--abigail::before { z-index: 2; }

/* Poster: 4:3 crop so the face stays centered & dominant.
   Slight darkening overlay at the bottom for play-icon contrast,
   nothing on top so the editorial reads clean. */
.tile--abigail .tile__poster {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  background-size: cover;
  background-position: center top;
  background-color: #0d2a3a;
}
.tile--abigail .tile__poster::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(13,42,58,0) 55%,
    rgba(13,42,58,0.35) 100%
  );
  pointer-events: none;
}

/* Play affordance: small, editorial, cream outline + cream triangle.
   No drop-shadow, no fill-circle, no glossy treatment. */
.tile--abigail .tile__play {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  display: block;
  line-height: 0;
  transition: transform .18s ease, opacity .18s ease;
  opacity: 0.88;
}
.tile--abigail:hover .tile__play,
.tile--abigail:focus-visible .tile__play {
  transform: translate(-50%, -50%) scale(1.04);
  opacity: 1;
}

/* Caption: minimal — kicker + headline only. No dek on tile face.
   Sits below the poster with same padding rhythm as other tiles. */
.tile--abigail .tile__caption {
  display: block;
  padding: .85rem 1.1rem 1rem;
  background: var(--tw-cream);
}
.tile--abigail .tile__caption .tile__label {
  display: block;
  margin-bottom: .25rem;
}
.tile--abigail .tile__caption .tile__hed {
  display: block;
}

/* Keyboard focus visibility on the tile button */
button.tile:focus-visible {
  outline: 2px solid var(--tw-ink);
  outline-offset: 2px;
}

/* ---------------------------------------------------------------------------
   Welcome dialog
   --------------------------------------------------------------------------- */
.abigail-dialog {
  width: min(880px, 92vw);
  max-height: 88vh;
  padding: 0;
  border: 1px solid var(--tw-rule);
  border-radius: var(--tw-radius);
  background: var(--tw-cream);
  color: var(--tw-ink);
  box-shadow: 0 18px 60px rgba(0,0,0,0.28);
  opacity: 0;
  transform: scale(.985);
  transition: opacity .22s ease, transform .22s ease;
}
.abigail-dialog[open] {
  opacity: 1;
  transform: scale(1);
}
.abigail-dialog::backdrop {
  background: rgba(13,42,58,0.45);
  backdrop-filter: blur(2px);
}

.abigail-dialog__title {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1.2rem;
  font-weight: 600;
  margin: 0;
  padding: .95rem 3rem .95rem 1.5rem;
  color: var(--tw-ink);
  border-bottom: 1px solid var(--tw-rule);
}

.abigail-dialog__close {
  position: absolute;
  top: .55rem; right: .55rem;
  width: 36px; height: 36px;
  display: inline-flex;
  align-items: center; justify-content: center;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 50%;
  color: var(--tw-ink-soft);
  cursor: pointer;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.abigail-dialog__close:hover,
.abigail-dialog__close:focus-visible {
  background: rgba(13,42,58,0.05);
  color: var(--tw-ink);
  border-color: var(--tw-rule);
  outline: none;
}

.abigail-dialog__frame {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #000;
}
.abigail-dialog__frame iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* ===========================================================================
   Family pillar — franchise sub-rail (Option B: strands above, franchises below)
   2026-05-27. Expanding worlds beneath permanent strands.
   =========================================================================== */

.home-family__franchises {
  margin-top: 2rem;
  padding-top: 1.75rem;
  border-top: 1px solid var(--tw-rule, #e8dec3);
}

.home-family__franchises-head {
  margin: 0 0 1.4rem;
  max-width: 42em;
}

.home-family__franchises-title {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1.2rem;
  font-weight: 700;
  margin: 0 0 .45rem;
  color: var(--tw-ink, #1a1a1a);
}

.home-family__franchises-intro {
  font-family: 'Source Serif 4', Georgia, serif;
  font-style: italic;
  font-size: .98rem;
  line-height: 1.55;
  color: var(--tw-dek, #5a4a35);
  margin: 0;
}

.home-family__franchise-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}
@media (min-width: 640px) {
  .home-family__franchise-list { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 960px) {
  .home-family__franchise-list { grid-template-columns: 1fr 1fr 1fr; }
}

.home-family__franchise {
  position: relative;
}

.home-family__franchise-link {
  display: grid;
  grid-template-columns: 84px 1fr;
  gap: 1rem;
  padding: 1rem;
  background: #fff;
  border: 1px solid var(--tw-rule, #e8dec3);
  border-radius: var(--tw-radius, 4px);
  text-decoration: none;
  color: inherit;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
  min-height: 132px;
  align-items: start;
}
.home-family__franchise-link:hover {
  border-color: var(--tw-ink, #2a2418);
  box-shadow: 0 4px 12px rgba(0,0,0,.06);
  transform: translateY(-1px);
}
.home-family__franchise-link--inactive {
  cursor: default;
  background: #fbf6e9;
  opacity: .92;
}
.home-family__franchise-link--inactive:hover {
  transform: none;
  box-shadow: none;
  border-color: var(--tw-rule, #e8dec3);
}

/* Accent stripe per franchise — top edge of card */
.home-family__franchise-link::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  border-top-left-radius: var(--tw-radius, 4px);
  border-top-right-radius: var(--tw-radius, 4px);
}
.home-family__franchise--sunset .home-family__franchise-link::before { background: var(--tw-c-sunset, #e8773a); }
.home-family__franchise--lush   .home-family__franchise-link::before { background: var(--tw-c-lush,   #2e8b57); }
.home-family__franchise--ocean  .home-family__franchise-link::before { background: var(--tw-c-ocean,  #1f6f8b); }
.home-family__franchise--mango  .home-family__franchise-link::before { background: var(--tw-c-mango,  #f5a623); }
.home-family__franchise--coral  .home-family__franchise-link::before { background: var(--tw-c-coral,  #c84b4b); }
.home-family__franchise--plum   .home-family__franchise-link::before { background: var(--tw-c-plum,   #6b3470); }

.home-family__franchise-cover {
  margin: 0;
}
.home-family__franchise-cover img {
  width: 100%;
  height: auto;
  display: block;
  border: 1px solid var(--tw-rule, #e8dec3);
  border-radius: 3px;
}

/* Placeholder (cover not yet ready): typographic franchise monogram */
.home-family__franchise-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 84px;
  height: 112px;
  border: 1px dashed var(--tw-rule, #e8dec3);
  border-radius: 3px;
  background: #fbf6e9;
}
.home-family__franchise--sunset .home-family__franchise-placeholder { background: linear-gradient(135deg, #fff4e1 0%, #ffe2cc 100%); border-color: rgba(232,119,58,.32); }
.home-family__franchise--lush   .home-family__franchise-placeholder { background: linear-gradient(135deg, #eaf6ee 0%, #d3ead9 100%); border-color: rgba(46,139,87,.32); }
.home-family__franchise--ocean  .home-family__franchise-placeholder { background: linear-gradient(135deg, #e7f0f4 0%, #cfdfe6 100%); border-color: rgba(31,111,139,.32); }
.home-family__franchise-mono {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 2.4rem;
  font-weight: 700;
  color: var(--tw-ink, #2a2418);
  line-height: 1;
  opacity: .72;
}

.home-family__franchise-body {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  min-width: 0;
}

.home-family__franchise-setting {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--tw-ink-soft, #6a5a45);
  margin: 0;
}

.home-family__franchise-name {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.2;
  color: var(--tw-ink, #1a1a1a);
  margin: .1rem 0 .25rem;
}

.home-family__franchise-subtitle {
  font-family: 'Source Serif 4', Georgia, serif;
  font-style: italic;
  font-size: .88rem;
  line-height: 1.4;
  color: var(--tw-ink-soft, #5a4a35);
  margin: 0 0 .45rem;
}

.home-family__franchise-cta {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .02em;
  color: var(--tw-ink, #2a2418);
  margin: auto 0 0;
}
.home-family__franchise-link--inactive .home-family__franchise-cta {
  color: var(--tw-ink-soft, #6a5a45);
}

/* ===========================================================================
   Backpage pillar — Caribbean editorial wit, sports, cartoons.
   2026-05-27. Editorial comic-strip energy inside a Caribbean newspaper.
   =========================================================================== */

.home-backpage {
  margin: 3rem 0;
  padding: 2rem 1.5rem 2.25rem;
  background: #faf5e6;                            /* warm cream, slightly distinct from family */
  border-top: 3px solid var(--tw-ink, #2a2418);   /* newspaper rule — top of "the back page" */
  border-bottom: 1px solid var(--tw-rule, #e8dec3);
  border-radius: var(--tw-radius, 4px);
  position: relative;
}
@media (min-width: 720px) {
  .home-backpage { padding: 2.5rem 2.25rem 2.75rem; }
}

.home-backpage__inner {
  max-width: 1080px;
  margin: 0 auto;
}

.home-backpage__head {
  margin: 0 0 1.75rem;
  max-width: 44em;
}

.home-backpage__kicker {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tw-c-coral, #c84b4b);              /* the Backpage signature accent */
  margin: 0 0 .55rem;
}

.home-backpage__title {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1.7rem;
  line-height: 1.2;
  margin: 0 0 .8rem;
  color: var(--tw-ink, #1a1a1a);
}
@media (min-width: 720px) {
  .home-backpage__title { font-size: 1.95rem; }
}

.home-backpage__dek {
  font-family: 'Source Serif 4', Georgia, serif;
  font-style: italic;
  font-size: 1.02rem;
  line-height: 1.55;
  color: var(--tw-dek, #5a4a35);
  margin: 0;
}

.home-backpage__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.6rem;
}
@media (min-width: 720px) {
  .home-backpage__grid {
    grid-template-columns: 1.4fr 1fr;
    grid-template-areas:
      "lead    pulse"
      "lead    chatter"
      "strip   strip";
    gap: 1.75rem 2rem;
  }
  .home-backpage__lead    { grid-area: lead; }
  .home-backpage__pulse   { grid-area: pulse; }
  .home-backpage__chatter { grid-area: chatter; }
  .home-backpage__strip   { grid-area: strip; }
}

/* ── Lead cartoon panel ─────────────────────────────────────── */
.home-backpage__lead {
  margin: 0;
  background: #fff;
  border: 1px solid var(--tw-rule, #e8dec3);
  border-radius: var(--tw-radius, 4px);
  overflow: hidden;
}
.home-backpage__lead img {
  display: block;
  width: 100%;
  height: auto;
}
.home-backpage__lead figcaption {
  padding: .85rem 1rem 1rem;
  display: flex;
  flex-direction: column;
  gap: .25rem;
  border-top: 1px solid var(--tw-rule, #e8dec3);
}
.home-backpage__lead-label {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tw-c-coral, #c84b4b);
}
.home-backpage__lead-caption {
  font-family: 'Source Serif 4', Georgia, serif;
  font-style: italic;
  font-size: .95rem;
  color: var(--tw-ink-soft, #5a4a35);
}

/* ── Sub-section heading (Pulse / Chatter / Cartoon drawer) ── */
.home-backpage__sub {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--tw-ink, #2a2418);
  margin: 0 0 .8rem;
  padding-bottom: .35rem;
  border-bottom: 1px solid var(--tw-rule, #e8dec3);
}

/* ── Pulse list (3 quick-hit items) ─────────────────────────── */
.home-backpage__pulse-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .85rem;
}
.home-backpage__pulse-item {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: .65rem;
  row-gap: .15rem;
  padding-left: .7rem;
  border-left: 3px solid var(--tw-c-ocean, #1f6f8b);
}
.home-backpage__pulse-item--live    { border-left-color: var(--tw-c-coral, #c84b4b); }
.home-backpage__pulse-item--upcoming{ border-left-color: var(--tw-c-mango, #f5a623); }
.home-backpage__pulse-item--abroad  { border-left-color: var(--tw-c-ocean, #1f6f8b); }
.home-backpage__pulse-item--headline{ border-left-color: var(--tw-c-lush, #2e8b57); }
.home-backpage__pulse-kind {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tw-ink-soft, #6a5a45);
  align-self: center;
  padding: .1rem .4rem;
  background: #fff;
  border: 1px solid var(--tw-rule, #e8dec3);
  border-radius: 2px;
}
.home-backpage__pulse-label {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .92rem;
  font-weight: 600;
  color: var(--tw-ink, #1a1a1a);
}
.home-backpage__pulse-label a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid transparent;
}
.home-backpage__pulse-label a:hover { border-bottom-color: var(--tw-ink, #2a2418); }
.home-backpage__pulse-note {
  grid-column: 1 / -1;
  font-family: 'Source Serif 4', Georgia, serif;
  font-style: italic;
  font-size: .86rem;
  line-height: 1.45;
  color: var(--tw-ink-soft, #5a4a35);
  margin-top: .15rem;
}

/* ── Chatter list (3 items: what fans are saying) ───────────── */
.home-backpage__chatter-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .75rem;
}
.home-backpage__chatter-item {
  display: flex;
  flex-direction: column;
  gap: .2rem;
}
.home-backpage__chatter-topic {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .9rem;
  font-weight: 700;
  color: var(--tw-ink, #1a1a1a);
}
.home-backpage__chatter-note {
  font-family: 'Source Serif 4', Georgia, serif;
  font-style: italic;
  font-size: .85rem;
  line-height: 1.5;
  color: var(--tw-ink-soft, #5a4a35);
}

/* ── Cartoon strip ──────────────────────────────────────────── */
.home-backpage__strip {
  border-top: 1px solid var(--tw-rule, #e8dec3);
  padding-top: 1.4rem;
}
.home-backpage__strip-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
}
@media (min-width: 540px) {
  .home-backpage__strip-list { grid-template-columns: repeat(4, 1fr); }
}
.home-backpage__strip-item figure {
  margin: 0;
  background: #fff;
  border: 1px solid var(--tw-rule, #e8dec3);
  border-radius: var(--tw-radius, 4px);
  overflow: hidden;
}
.home-backpage__strip-item img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: center;
}
.home-backpage__strip-item figcaption {
  padding: .5rem .65rem .65rem;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .72rem;
  font-weight: 600;
  color: var(--tw-ink-soft, #5a4a35);
  border-top: 1px solid var(--tw-rule, #e8dec3);
  text-align: center;
  letter-spacing: .01em;
}

/* ── More link ──────────────────────────────────────────────── */
.home-backpage__more {
  margin: 1.6rem 0 0;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .9rem;
  font-weight: 600;
}
.home-backpage__more a {
  text-decoration: none;
  color: var(--tw-ink, #2a2418);
  border-bottom: 1px solid var(--tw-rule, #e8dec3);
  padding-bottom: 2px;
  transition: border-color .15s ease;
}
.home-backpage__more a:hover { border-bottom-color: var(--tw-ink, #2a2418); }

/* ── Mobile tightening ──────────────────────────────────────── */
@media (max-width: 720px) {
  .home-backpage { padding: 1.5rem 1.1rem 1.75rem; margin: 2rem 0; }
  .home-backpage__title { font-size: 1.45rem; }
  .home-backpage__strip-list { grid-template-columns: repeat(2, 1fr); }
}

/* ===========================================================================
   site-footer — institutional permanence layer.
   2026-05-27. Newspaper-airy. Restrained. Premium. NOT corporate sitemap.
   Supersedes prior site-footer rules anywhere earlier in homepage.css.
   =========================================================================== */

.site-footer {
  margin-top: 4rem;
  padding: 3rem 1.5rem 2.5rem;
  background: #faf5e6;
  border-top: 1px solid #d8cba8;
  font-family: 'Inter', system-ui, sans-serif;
  color: #3a2f1f;
}
@media (min-width: 720px) {
  .site-footer { padding: 3.5rem 2rem 2.75rem; }
}

.site-footer__inner {
  max-width: 1200px;
  margin: 0 auto;
}

/* ── Institutional preamble (the publication-of-record line) ── */
.site-footer__institution {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1.02rem;
  line-height: 1.55;
  color: #2a2418;
  margin: 0 0 2.5rem;
  max-width: 56em;
  letter-spacing: -.005em;
}
.site-footer__institution strong {
  font-weight: 700;
  letter-spacing: .01em;
}

/* ── Four-column grid ─────────────────────────────────────── */
.site-footer__columns {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}
@media (min-width: 540px) {
  .site-footer__columns { grid-template-columns: 1fr 1fr; gap: 2rem; }
}
@media (min-width: 880px) {
  .site-footer__columns { grid-template-columns: repeat(4, 1fr); gap: 2.5rem; }
}

.footer-col h3 {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #6a5a45;
  margin: 0 0 .9rem;
  padding-bottom: .45rem;
  border-bottom: 1px solid #e0d4b5;
}

.footer-col ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.footer-col li {
  margin: 0 0 .55rem;
  line-height: 1.4;
}

.footer-col a {
  display: inline-block;
  color: #2a2418;
  text-decoration: none;
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: .98rem;
  border-bottom: 1px solid transparent;
  transition: border-color .15s ease, color .15s ease;
  padding-bottom: 1px;
}
.footer-col a:hover {
  color: var(--tw-c-ocean, #1f6f8b);
  border-bottom-color: var(--tw-c-ocean, #1f6f8b);
}

/* ── Sub-section within a column (used in Connect → Corridors) ── */
.footer-col__sub {
  margin-top: 1.75rem;
  padding-top: 1.25rem;
  border-top: 1px solid #e8dec3;
}
.footer-col__sub h3 {
  margin-top: 0;
}

/* ── Base line: copyright + tagline ─────────────────────────── */
.site-footer__base {
  margin-top: 3rem;
  padding-top: 1.5rem;
  border-top: 1px solid #d8cba8;
  display: flex;
  flex-direction: column;
  gap: .55rem;
}
@media (min-width: 720px) {
  .site-footer__base {
    flex-direction: row;
    justify-content: space-between;
    align-items: baseline;
    gap: 1.5rem;
  }
}

.site-footer__legal {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .76rem;
  line-height: 1.55;
  color: #6a5a45;
  margin: 0;
  max-width: 56em;
}

.site-footer__tagline {
  font-family: 'Source Serif 4', Georgia, serif;
  font-style: italic;
  font-size: .92rem;
  color: #5a4a35;
  margin: 0;
  white-space: nowrap;
}

/* ── Mobile tightening ──────────────────────────────────────── */
@media (max-width: 540px) {
  .site-footer { padding: 2.25rem 1.1rem 2rem; }
  .site-footer__institution { font-size: .96rem; margin-bottom: 2rem; }
  .footer-col a { font-size: .94rem; }
}

/* ===========================================================================
   Country Decisions — region parity rewrite.
   2026-05-27. Caribbean and Africa render with identical card sizing, name
   treatment, and hover. The 16-vs-4 country count is reflected in column
   count (Caribbean fills 4-wide × 4-deep on desktop, Africa fills 4-wide × 1-deep)
   but the cards themselves are the same size. No more "GH/KE/NG/SA mini-tiles."
   Supersedes earlier .country-grid rules.
   =========================================================================== */

/* Grid container: stacked on narrow screens, equal-width on wide screens.
   We don't use 3fr 1fr (which made Africa cards tiny). Both regions get the
   full row width when stacked, and the same column width when side-by-side. */
.country-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  margin-top: 1.25rem;
}
@media (min-width: 960px) {
  .country-grid {
    grid-template-columns: 1fr;     /* still stacked vertically — Caribbean above, Africa below */
    gap: 2.25rem;
  }
}

.country-grid__group {
  min-width: 0;
}

.country-grid__group-title {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--tw-ink-soft, #6a5a45);
  margin: 0 0 .85rem;
  padding-bottom: .5rem;
  border-bottom: 1px solid var(--tw-rule, #e8dec3);
}

.country-cards {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: .75rem;
}
@media (min-width: 540px) { .country-cards { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 720px) { .country-cards { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1080px){ .country-cards { grid-template-columns: repeat(4, 1fr); } }

/* The Africa group has only 4 countries — at desktop width it renders as one
   row of four cards, same card size as Caribbean. Don't force it into a smaller
   column. */
.country-grid__group--africa .country-cards {
  max-width: 100%;
}

.country-card {
  display: block;
  text-decoration: none;
  color: inherit;
  background: #fff;
  border: 1px solid var(--tw-rule, #e8dec3);
  border-radius: var(--tw-radius, 4px);
  overflow: hidden;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.country-card:hover {
  border-color: var(--tw-ink, #2a2418);
  box-shadow: 0 4px 12px rgba(0,0,0,.07);
  transform: translateY(-1px);
}

.country-card__visual {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background-size: cover;
  background-position: center;
  background-color: #f0e6cf;     /* fallback cream behind partly-loaded images */
}

.country-card__name {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .55rem .75rem;
  border-top: 1px solid var(--tw-rule, #e8dec3);
  background: #faf7f2;
}

.country-card__flag {
  font-size: 1.05rem;
  line-height: 1;
  flex-shrink: 0;
}

.country-card__label {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: .92rem;
  font-weight: 600;
  color: var(--tw-ink, #1a1a1a);
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (min-width: 720px) {
  .country-card__label { font-size: .95rem; }
}

/* ===========================================================================
   Newsletter band — inline capture, above the fold.
   2026-05-27. Restrained, publication-native, cream-compatible.
   Mounts under masthead. No popup. Single email input. Single line trust copy.
   =========================================================================== */

.tw-newsletter-band {
  width: 100%;
  background: #f3eedb;            /* slightly deeper cream so it reads as a band */
  border-bottom: 1px solid var(--tw-rule, #e8dec3);
  padding: 1.5rem 1rem;
}
@media (min-width: 720px) {
  .tw-newsletter-band { padding: 1.75rem 2rem; }
}

.tw-newsletter-band__inner {
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
  align-items: center;
}
@media (min-width: 880px) {
  .tw-newsletter-band__inner {
    grid-template-columns: 1.1fr 1fr;
    gap: 2.5rem;
  }
}

.tw-newsletter-band__copy {
  min-width: 0;
}

.tw-newsletter-band__kicker {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tw-c-coral, #c84b4b);
  margin: 0 0 .4rem;
}

.tw-newsletter-band__title {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1.15rem;
  line-height: 1.3;
  margin: 0 0 .35rem;
  color: var(--tw-ink, #1a1a1a);
  letter-spacing: -.005em;
}
@media (min-width: 720px) {
  .tw-newsletter-band__title { font-size: 1.3rem; }
}

.tw-newsletter-band__dek {
  font-family: 'Source Serif 4', Georgia, serif;
  font-style: italic;
  font-size: .9rem;
  line-height: 1.5;
  color: var(--tw-dek, #5a4a35);
  margin: 0;
}

.tw-newsletter-band__form {
  min-width: 0;
}

.tw-newsletter-band__label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

.tw-newsletter-band__row {
  display: flex;
  gap: .5rem;
  align-items: stretch;
}

.tw-newsletter-band__input {
  flex: 1 1 auto;
  min-width: 0;
  padding: .65rem .85rem;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .95rem;
  color: var(--tw-ink, #1a1a1a);
  background: #fff;
  border: 1px solid #d8cba8;
  border-radius: 3px;
  outline: none;
  transition: border-color .15s ease;
}
.tw-newsletter-band__input:focus {
  border-color: var(--tw-c-ocean, #1f6f8b);
  box-shadow: 0 0 0 3px rgba(31,111,139,.12);
}

.tw-newsletter-band__submit {
  flex-shrink: 0;
  padding: .65rem 1.25rem;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .88rem;
  font-weight: 700;
  letter-spacing: .04em;
  color: #fff;
  background: var(--tw-ink, #2a2418);
  border: 1px solid var(--tw-ink, #2a2418);
  border-radius: 3px;
  cursor: pointer;
  transition: background-color .15s ease;
}
.tw-newsletter-band__submit:hover {
  background: var(--tw-c-ocean, #1f6f8b);
  border-color: var(--tw-c-ocean, #1f6f8b);
}

.tw-newsletter-band__legal {
  margin: .55rem 0 0;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .72rem;
  color: var(--tw-ink-soft, #6a5a45);
}
.tw-newsletter-band__legal a {
  color: inherit;
  border-bottom: 1px solid var(--tw-rule, #e8dec3);
  text-decoration: none;
  padding-bottom: 1px;
}
.tw-newsletter-band__legal a:hover { border-bottom-color: var(--tw-ink, #2a2418); }

/* ===========================================================================
   Backpage lead — make the image clickable cleanly (Phase 2 dynamic).
   2026-05-27.
   =========================================================================== */

.home-backpage__lead-link {
  display: block;
  text-decoration: none;
  color: inherit;
}
.home-backpage__lead-link img {
  display: block;
  transition: opacity .15s ease;
}
.home-backpage__lead-link:hover img { opacity: .94; }

.home-backpage__lead-caption a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color .15s ease;
}
.home-backpage__lead-caption a:hover { border-bottom-color: var(--tw-ink, #2a2418); }

/* ===========================================================================
   Masthead actions cluster — search magnifier + subscribe button, right side.
   2026-05-27. Restrained, typography-led, no app-icon energy.
   =========================================================================== */

.masthead__actions {
  display: flex;
  align-items: center;
  gap: .85rem;
  margin-left: auto;
}

.masthead__search {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .45rem .7rem;
  color: var(--tw-ink, #2a2418);
  text-decoration: none;
  border: 1px solid transparent;
  border-radius: 3px;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .82rem;
  font-weight: 600;
  letter-spacing: .02em;
  transition: border-color .15s ease, color .15s ease, background-color .15s ease;
}
.masthead__search:hover {
  border-color: var(--tw-rule, #e8dec3);
  color: var(--tw-c-ocean, #1f6f8b);
  background: rgba(232,222,195,.35);
}
.masthead__search-icon {
  flex-shrink: 0;
  color: inherit;
}
.masthead__search:hover .masthead__search-icon { color: var(--tw-c-ocean, #1f6f8b); }

@media (max-width: 720px) {
  .masthead__actions { gap: .4rem; }
  .masthead__search-text { display: none; }   /* icon only on narrow */
  .masthead__search { padding: .45rem .55rem; }
}

/* ===========================================================================
   Nav-primary Shop accent — subtle sunset tint, not loud
   =========================================================================== */
.nav-primary__item--shop {
  color: var(--tw-c-sunset, #e8773a);
}
.nav-primary__item--shop.is-active,
.nav-primary__item--shop:hover {
  color: var(--tw-c-coral, #c84b4b);
}

/* From Miss Icie Table panel (home-backpage) 2026-05-27 */
.home-backpage__icie { margin:0; display:flex; flex-direction:column; gap:.5rem; border-top:2px solid var(--tw-c-bronze,#9c6b3f); padding-top:1rem; }
.home-backpage__icie-link { display:block; }
.home-backpage__icie img { width:100%; height:auto; border-radius:var(--tw-radius,4px); display:block; }
.home-backpage__icie-label { display:block; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--tw-c-bronze,#9c6b3f); font-weight:600; }
.home-backpage__icie-title { display:block; font-weight:700; line-height:1.2; margin-top:.15rem; }
.home-backpage__icie-title a { text-decoration:none; color:inherit; }
.home-backpage__icie-dek { display:block; font-style:italic; font-size:.9rem; color:var(--tw-ink-soft,#555); margin-top:.25rem; }


/* ---------- Newsletter band sticky + dismissible (2026-05-28 late) ----------
   Band stays in document flow at its current position, BUT becomes sticky when it
   reaches the top of viewport on scroll. Includes X dismiss button (top-right).
   Dismissal persisted in localStorage; tw-newsletter-band-dismiss.js handles state.
   When dismissed, body gets .nl-dismissed class which hides the band entirely. */
.tw-newsletter-band {
  position: sticky !important;
  /* Pins below the sticky site header (header z:100, ~120px after compression).
     Adjust top value if header height changes. */
  top: 120px !important;
  z-index: 95 !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}
@media (max-width: 720px) {
  .tw-newsletter-band { top: 100px !important; }
}
.tw-newsletter-band__inner {
  position: relative;
  padding-right: 2.5rem !important; /* clearance for the dismiss X */
}
.tw-newsletter-band__dismiss {
  position: absolute;
  top: .5rem;
  right: .5rem;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 0;
  color: var(--tw-ink, #2a2418);
  cursor: pointer;
  border-radius: 50%;
  opacity: .55;
  transition: opacity 150ms ease, background 150ms ease;
}
.tw-newsletter-band__dismiss:hover,
.tw-newsletter-band__dismiss:focus {
  opacity: 1;
  background: rgba(0,0,0,.05);
  outline: none;
}
/* When dismissed, hide the band entirely - body class set by JS on load */
body.nl-dismissed .tw-newsletter-band { display: none !important; }
/* ---------- /Newsletter band sticky + dismissible ---------- */
/* System Update v1: posting date on Today's Signal items */
.signal-list__date{display:block;margin-top:.2rem;font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;color:#9a907f}

/* family library strands as routed links (2026-05-29) */
.home-family__strand-link{display:block;text-decoration:none;color:inherit}
.home-family__strand-link:hover .home-family__strand-name{text-decoration:underline}

/* ----------------------------------------------------------------------
   WEEKEND EDITION — flagship Week in Review. Newspaper front-page energy,
   NOT a promo banner. Built to outweigh every other homepage module and
   read instantly as "the weekend edition." 2026-05-31.
   ---------------------------------------------------------------------- */
.home-weekend-read {
  margin: 0 0 2.75rem;
}
.weekend-edition {
  background: linear-gradient(180deg, #fcf6e8 0%, #f4e6c6 100%);
  border: 1px solid #c89a47;
  border-top: 6px solid var(--tw-accent, #c89a47);
  border-radius: var(--tw-radius, 4px);
  padding: 2.4rem 2.4rem 2rem;
  position: relative;
  box-shadow: 0 4px 22px rgba(120, 86, 20, .13);
}
@media (min-width: 720px) {
  .weekend-edition { padding: 3rem 3.2rem 2.4rem; }
}
.weekend-edition__band {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 1.25rem;
  padding-bottom: .9rem;
  border-bottom: 1px solid rgba(120, 86, 20, .22);
}
.weekend-edition__eyebrow {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: #6b4a14;
}
.weekend-edition__badge {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tw-cream, #f8f3e7);
  background: var(--tw-accent, #c89a47);
  padding: .3rem .7rem;
  border-radius: 999px;
  white-space: nowrap;
}
.weekend-edition__kicker {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #9a7427;
  margin: 0 0 .5rem;
}
.weekend-edition__title {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 2rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.12;
  margin: 0 0 .85rem;
  color: var(--tw-ink, #1a1a1a);
}
@media (min-width: 720px) {
  .weekend-edition__title { font-size: 2.7rem; }
}
.weekend-edition__title a { color: inherit; text-decoration: none; }
.weekend-edition__title a:hover { text-decoration: underline; text-decoration-color: var(--tw-accent, #c89a47); text-underline-offset: 3px; }
.weekend-edition__promise {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1.18rem;
  font-style: italic;
  color: #4a3613;
  line-height: 1.5;
  margin: 0 0 1.1rem;
  max-width: 68ch;
}
.weekend-edition__meta {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #8a6a28;
  margin: 0 0 1.2rem;
}
.weekend-edition__meta-sep { margin: 0 .55rem; opacity: .5; }
.weekend-edition__divider {
  border: 0;
  border-top: 1px solid rgba(120, 86, 20, .22);
  margin: 0 0 1.1rem;
}
.weekend-edition__note {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 1rem;
  color: #5a4318;
  line-height: 1.55;
  margin: 0 0 1.4rem;
  max-width: 70ch;
}
.weekend-edition__note-label {
  font-weight: 700;
  font-style: italic;
  color: #6b4a14;
}
.weekend-edition__cta {
  margin: 0 0 .85rem;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 1rem;
  font-weight: 700;
}
.weekend-edition__cta a {
  display: inline-block;
  padding: .8rem 1.7rem;
  background: var(--tw-ink, #1a1a1a);
  color: var(--tw-cream, #f8f3e7);
  text-decoration: none;
  border-radius: var(--tw-radius, 4px);
  letter-spacing: .03em;
  font-size: 1.02rem;
}
.weekend-edition__cta a:hover { background: var(--tw-accent, #c89a47); color: #2a1e08; }
.weekend-edition__progression {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: .85rem;
  color: #7a5e2a;
  margin: 0;
}
.weekend-edition__progression a { color: #6b4a14; font-weight: 700; text-decoration: none; }
.weekend-edition__progression a:hover { text-decoration: underline; }
@media (max-width: 720px) {
  .weekend-edition { padding: 1.6rem 1.4rem 1.4rem; }
  .weekend-edition__title { font-size: 1.6rem; }
  .weekend-edition__promise { font-size: 1.05rem; }
  .weekend-edition__band { flex-direction: row; flex-wrap: wrap; }
}

/* ===== PHASE 2 — Sunday Intelligence flagship hero (Sunday-only) ===== */
.home-sunday-flagship { margin: 0 0 2rem; }
.si-flagship {
  background: linear-gradient(180deg, #11243f 0%, #1a3050 100%);
  border: 1px solid #c89a47; border-top: 5px solid #c89a47; border-radius: 10px;
  padding: 2.2rem 2.2rem 2rem;
}
.si-flagship__band { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; margin: 0 0 1.1rem; }
.si-flagship__eyebrow { font-family: 'Inter', system-ui, sans-serif; font-size: .72rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: #e9c877; }
.si-flagship__badge { font-family: 'Inter', system-ui, sans-serif; font-size: .64rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: #11243f; background: #e9c877; padding: .25rem .7rem; border-radius: 4px; }
.si-flagship__kicker { font-family: 'Inter', system-ui, sans-serif; font-size: .82rem; font-weight: 700; letter-spacing: .04em; color: #aebdd2; margin: 0 0 .5rem; }
.si-flagship__title { font-family: 'Source Serif 4', Georgia, serif; font-size: 2rem; line-height: 1.2; margin: 0 0 .9rem; }
.si-flagship__title a { color: #fff; text-decoration: none; }
.si-flagship__title a:hover { text-decoration: underline; text-decoration-color: #c89a47; }
@media (min-width: 720px){ .si-flagship__title { font-size: 2.5rem; } }
.si-flagship__promise { font-size: 1.1rem; line-height: 1.55; color: #cfd8e6; margin: 0 0 1.1rem; }
.si-flagship__meta { font-family: 'Inter', system-ui, sans-serif; font-size: .82rem; color: #93a3bd; margin: 0 0 1.4rem; }
.si-flagship__meta-sep { margin: 0 .5rem; opacity: .5; }
.si-flagship__cta { margin: 0 0 1rem; }
.si-flagship__cta a { display: inline-block; font-family: 'Inter', system-ui, sans-serif; font-size: .9rem; font-weight: 800; letter-spacing: .03em; color: #11243f; background: #e9c877; padding: .7rem 1.4rem; border-radius: 6px; text-decoration: none; }
.si-flagship__cta a:hover { background: #f0d089; }
.si-flagship__secondary { font-size: .9rem; color: #aebdd2; margin: 1rem 0 0; padding-top: 1rem; border-top: 1px solid rgba(233,200,119,.25); }
.si-flagship__secondary a { color: #e9c877; }
/* ===== Homepage testimonial band - light pull-quote, every day ===== */
.home-testimonial { margin: 2.5rem 0; padding: 1.8rem 2rem; background: #faf6ec; border-left: 4px solid #c89a47; border-radius: 0 8px 8px 0; }
.home-testimonial__fig { margin: 0; max-width: 60rem; }
.home-testimonial__quote { font-family: 'Source Serif 4', Georgia, serif; font-size: 1.3rem; line-height: 1.5; font-style: italic; color: #1c2230; margin: 0 0 .9rem; }
@media (min-width: 720px){ .home-testimonial__quote { font-size: 1.45rem; } }
.home-testimonial__cite { font-family: 'Inter', system-ui, sans-serif; font-size: .85rem; font-weight: 700; color: #10233f; }
.home-testimonial__loc { font-weight: 500; color: #6b7689; }
.home-testimonial__loc::before { content: " \2014 "; }
/* ===== Flagship conversion upgrades — value-prop + benefit strip ===== */
.si-flagship__valueprop { font-family: 'Inter', system-ui, sans-serif; font-size: .96rem; line-height: 1.5; color: #aebdd2; margin: 0 0 1.3rem; max-width: 46rem; }
.si-flagship__benefits { display: flex; flex-wrap: wrap; gap: .5rem 1.4rem; list-style: none; margin: 1.2rem 0 0; padding: 0; }
.si-flagship__benefits li { font-family: 'Inter', system-ui, sans-serif; font-size: .82rem; font-weight: 600; color: #cfd8e6; padding-left: 1.4rem; position: relative; }
.si-flagship__benefits li::before { content: "\2713"; position: absolute; left: 0; color: #e9c877; font-weight: 800; }