/* Force all blog posts to stack in a single column on small screens */
@media (max-width: 767px) {
  .blog-posts {
    display: block !important; /* disables grid/flex behaviour */
  }

  .blog-post {
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    float: none !important;
  }

  .blog-post .image {
    width: 100%;
    aspect-ratio: 5 / 4; /* keeps consistent image height */
    background-size: cover;
    background-position: center;
  }
}

.bb\:block-background.bb\:block-background--image.cbb-bg-image[style*="rings-background.svg"] {
  background-size: 20% !important;
}

/* ===== Global Top Bar ===== */
#fbf-topbar{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999999;
  background: #f5f5f5; /* change if needed */
  color: #004745; /* text colour */
  font-size: 14px;
  line-height: 1.2;
}

#fbf-topbar .fbf-topbar-inner{
  max-width: 1280px;
  margin: 0 auto;
  padding: 8px 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
}

#fbf-topbar .fbf-topbar-text{
  font-weight: 600;
  text-align: center;
}

/* ===== Button ===== */
#fbf-topbar .fbf-topbar-cta a,
#fbf-topbar .fbf-topbar-cta .download-link,
#fbf-topbar .fbf-topbar-cta .dlm-download-link{
  display: inline-block;
  background: #004745 !important;
  color: #fff !important;
  text-decoration: none !important;
  padding: 6px 18px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 13px;
  line-height: 1;
  white-space: nowrap;
}

/* Push content down */
body{
  padding-top: 48px;
}

#main-header{
  top: 48px !important;
}

/* ===== Mobile ===== */
@media (max-width: 767px){

  #fbf-topbar .fbf-topbar-inner{
    flex-direction: column;
    padding: 10px 18px;
    gap: 8px;
  }

  #fbf-topbar .fbf-topbar-text{
    white-space: normal;
    line-height: 1.3;
    max-width: 320px;
    margin: 0 auto;
  }

  body{
    padding-top: 90px;
  }

  #main-header{
    top: 90px !important;
  }
}

/* ===== Fix: keep WP admin bar visible ===== */

/* Desktop admin bar is 32px tall */
body.admin-bar #fbf-topbar{
  top: 32px;
}

/* Mobile admin bar is 46px tall */
@media (max-width: 782px){
  body.admin-bar #fbf-topbar{
    top: 46px;
  }
}

.white-bg

{background: white;
padding: 10px;
border-radius: 8px;}

.place-details-compact-container
{display: none !important;}

/* ==========================================
   HERO BLOG POST
   ========================================== */

.blog-posts .blog-post:first-child {
  display: grid !important;
  grid-template-columns: 52% 48%;
  gap: 40px;
  align-items: center;
  max-width: 1220px;
  margin: 0 auto 70px;
}

/* Hero image */
.blog-posts .blog-post:first-child .image {
  width: 100% !important;
  aspect-ratio: 8 / 5;
  min-height: 0 !important;
  background-size: contain !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  border-radius: 8px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.20);
}

/* Hero text panel */
.blog-posts .blog-post:first-child .content {
  position: static !important;
  transform: none !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 40px !important;
  box-sizing: border-box;
  border-radius: 8px;
}

/* Hero title */
.blog-posts .blog-post:first-child .title {
  margin: 0 0 24px;
  line-height: 1.15;
}

/* Shorten hero excerpt */
.blog-posts .blog-post:first-child .description {
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-bottom: 18px;
}

/* Hide headings/lists inside hero excerpt */
.blog-posts .blog-post:first-child .description h2,
.blog-posts .blog-post:first-child .description h3,
.blog-posts .blog-post:first-child .description ul,
.blog-posts .blog-post:first-child .description ol {
  display: none;
}

/* Read more */
.blog-posts .blog-post:first-child .read-more {
  display: inline-block;
  margin-top: 8px;
}

/* ==========================================
   BLOG CARDS UNDERNEATH
   ========================================== */

.blog-posts .blog-post:not(:first-child) {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}

/* Card image area */
.blog-posts .blog-post:not(:first-child) .image {
  width: 100% !important;
  aspect-ratio: 8 / 5;
  min-height: 0 !important;
  height: auto !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  border-radius: 8px 8px 0 0;
}

/* Text panel */
.blog-posts .blog-post:not(:first-child) .content {
  position: static !important;
  width: 100% !important;
  max-width: none !important;
  padding: 25px !important;
  box-sizing: border-box;
}

/* Card title */
.blog-posts .blog-post:not(:first-child) .title {
  margin-bottom: 15px;
  line-height: 1.2;
}

/* Short excerpt */
.blog-posts .blog-post:not(:first-child) .description {
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Hide headings/lists in card excerpt */
.blog-posts .blog-post:not(:first-child) .description h2,
.blog-posts .blog-post:not(:first-child) .description h3,
.blog-posts .blog-post:not(:first-child) .description ul,
.blog-posts .blog-post:not(:first-child) .description ol {
  display: none;
}

/* Read more */
.blog-posts .blog-post:not(:first-child) .read-more {
  display: inline-block;
  margin-top: 15px;
}

/* ==========================================
   RESPONSIVE
   ========================================== */

@media (max-width: 900px) {

  .blog-posts .blog-post:first-child {
    grid-template-columns: 1fr;
    gap: 25px;
  }

  .blog-posts .blog-post:first-child .content {
    padding: 28px !important;
  }

  .blog-posts .blog-post:first-child .description {
    -webkit-line-clamp: 5;
  }
}


/* Single blog post featured image */
.single-post .wp-post-image,
.single-post .post-thumbnail img,
.single-post .featured-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 10;
  object-fit: contain !important;
  object-position: center;
  display: block;
  border-radius: 8px;
  
}

/* If the single post image is a background image */
.single-post .post-thumbnail,
.single-post .featured-image {
  aspect-ratio: 16 / 10;
  background-size: contain !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}