/**
 * Specials page (template-specials.php) — layout additions only.
 *
 * No new colors, fonts, or spacing values are introduced here. Every value
 * below is copied from assets/styles/globals.css:
 *   border color -> $border (#dad9cc), used already on .btn-default/.container
 *   panel bg     -> #fff, used already on button hover/active states
 * Image aspect-ratio, object-fit, and hover-zoom all come from the existing
 * .hover-entry/.post-img rules (unchanged) by reusing those classes in the
 * markup. Padding/gaps on the cards are handled with the theme's existing
 * Bootstrap spacer utility classes (p-2, p-3, p-lg-4, mb-4, etc.) directly in
 * the template markup, not here.
 */

.offer-card,
.featured-offer {
  border: 1px solid #dad9cc;
  overflow: hidden;
}

.featured-offer__media {
  flex: 0 0 56%;
  max-width: 56%;
}

@media (max-width: 991.98px) {
  .featured-offer__media {
    flex: 0 0 100%;
    max-width: 100%;
  }
}

/* Toggled by the tab-filter script in template-specials.php. */
.offer-card-col.is-hidden {
  display: none;
}

.offer-card .sub-heading {
  line-height: 1.2;
}

/**
 * single-specials.php hero — photo with a floating title panel, in place of
 * the site's usual full-width dark-overlay .page-header.has-bg treatment.
 * Panel background is $beige (#FFFEF2) at 94% opacity, same value already
 * used for .page-header.dark's background.
 */
.specials-hero__media {
  position: relative;
}

.specials-hero__img {
  display: block;
  width: 100%;
  height: 420px;
  object-fit: cover;
}

.specials-hero__panel {
  position: absolute;
  left: 3.45vw;
  bottom: 2.5rem;
  max-width: 640px;
  background: rgba(255, 254, 242, 0.94);
  padding: 2.5rem 3rem;
}

/* Reuses .breadcrumbs-nav's own font-size (0.8rem); text color matches
   .dark .breadcrumbs-nav *'s existing dark-on-light rule ($dark #333333). */
.specials-hero__breadcrumb,
.specials-hero__breadcrumb * {
  font-size: 0.8rem;
  color: #333333;
}

.specials-hero__breadcrumb {
  margin-bottom: 0.75rem;
}

@media (max-width: 1400px) {
  .specials-hero__panel {
    left: 2.5rem;
  }
}

@media (max-width: 991.98px) {
  .specials-hero__img {
    height: 320px;
  }
  .specials-hero__panel {
    left: 1.25rem;
    right: 1.25rem;
    bottom: 1.25rem;
    max-width: none;
    padding: 1.75rem 2rem;
  }
}

@media (max-width: 767.98px) {
  .specials-hero__img {
    height: 240px;
  }
  .specials-hero__panel {
    position: static;
    background: #FFFEF2;
  }
}

/**
 * single-specials.php booking rail — key-fact rows (label left, value right)
 * with dividers, plus the phone link color. Divider is $border_light
 * (#F0EFE1, same as .specials-nav's border-bottom); phone color is $red
 * (#9B2D12, same as .book-cta's background).
 */
.specials-rail__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  padding: 1rem 0;
  border-bottom: 1px solid #F0EFE1;
}

.specials-rail__row:last-of-type {
  border-bottom: none;
}

.specials-rail__row-label {
  font-weight: 600;
  color: #333333;
  white-space: nowrap;
}

.specials-rail__row-value {
  font-family: "larken", sans-serif;
  font-size: 1.15rem;
  color: #333333;
  text-align: right;
}

.specials-rail__phone {
  color: #9B2D12;
  font-weight: 700;
  text-decoration: none;
}