/* ==========================================
   BRAND PAGES (AL MESSILAH, BACKBURNER)
   Additions on top of the Danah brand page styles in styles.css.
========================================== */

/* Logo card: keeps the Danah card height whatever the logo's shape */
.brand-logo-card {
  min-height: 329px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.danah-logo-img.brand-logo-messilah {
  max-width: none;
  width: 43%;
}

.danah-logo-img.brand-logo-backburner {
  max-width: none;
  width: 76%;
}

/* About text sitting fully beside the image */
.brand-about-text .danah-text-p:last-child {
  margin-bottom: 0;
}

/* Full-width photo between galleries */
.brand-wide-section {
  padding-top: 40px;
  padding-bottom: 40px;
}

.brand-wide-img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 0px;
  box-shadow: none;
}

/* Second staggered collage: left image top-aligned, right image lower */
.brand-showcase-alt .danah-showcase-col-left {
  flex: 0 0 calc((100% - 32px) * 0.4034);
  width: calc((100% - 32px) * 0.4034);
  max-width: calc((100% - 32px) * 0.4034);
  margin-top: 0;
}

.brand-showcase-alt .danah-showcase-col-right {
  flex: 0 0 calc((100% - 32px) * 0.5966);
  width: calc((100% - 32px) * 0.5966);
  max-width: calc((100% - 32px) * 0.5966);
  margin-top: 4.7%;
}

@media (max-width: 991px) {
  .brand-logo-card {
    min-height: 240px;
  }
  .brand-wide-section {
    padding-top: 25px;
    padding-bottom: 25px;
  }
  .brand-showcase-alt .danah-showcase-col-left {
    flex: 0 0 calc((100% - 20px) * 0.4034);
    width: calc((100% - 20px) * 0.4034);
    max-width: calc((100% - 20px) * 0.4034);
  }
  .brand-showcase-alt .danah-showcase-col-right {
    flex: 0 0 calc((100% - 20px) * 0.5966);
    width: calc((100% - 20px) * 0.5966);
    max-width: calc((100% - 20px) * 0.5966);
  }
}

@media (max-width: 576px) {
  .brand-logo-card {
    min-height: 180px;
  }
  .danah-logo-img.brand-logo-messilah {
    width: 45%;
  }
  .danah-logo-img.brand-logo-backburner {
    width: 85%;
  }
  .brand-wide-section {
    padding-top: 15px;
    padding-bottom: 15px;
  }
  .brand-showcase-alt .danah-showcase-col-left {
    flex: 0 0 calc((100% - 12px) * 0.4034);
    width: calc((100% - 12px) * 0.4034);
    max-width: calc((100% - 12px) * 0.4034);
  }
  .brand-showcase-alt .danah-showcase-col-right {
    flex: 0 0 calc((100% - 12px) * 0.5966);
    width: calc((100% - 12px) * 0.5966);
    max-width: calc((100% - 12px) * 0.5966);
  }
}

/* ==========================================
   BRAND PAGES (BASCOTA, AL THIQA MARKET, CHICSTER, ALTCO)
   Collage rows are laid out in percentages of the content width,
   measured from the 1920px XD designs, so the proportions hold at
   every screen size.
========================================== */

/* Logo card colors */
.danah-logo-card.brand-card-bascota {
  background: #270F0F;
}

.danah-logo-card.brand-card-market {
  background: #11271A;
}

.danah-logo-card.brand-card-outline {
  border: 1px solid #71706E;
}

.danah-logo-img.brand-logo-fluid {
  max-width: none;
}

/* One body section holding about, collages and text */
.brand-page-body {
  padding-bottom: 120px;
}

@media (max-width: 991px) {
  .brand-page-body {
    padding-bottom: 40px;
  }
}

.brand-collage {
  display: flex;
  align-items: flex-start;
  margin-top: var(--gap, 0);
}

.brand-collage-item {
  flex: 0 0 auto;
  width: var(--w);
  margin-left: var(--ml, 0);
  margin-top: var(--mt, 0);
}

.brand-collage-item img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 0px;
  box-shadow: none;
}

.brand-body-text {
  margin-top: var(--gap, 0);
}

.brand-body-text .danah-text-p:last-child {
  margin-bottom: 0;
}

.brand-body-left {
  padding-left: 2.5%;
  padding-right: 6%;
}

.brand-body-center {
  text-align: center;
  padding-left: 1%;
  padding-right: 1%;
}

/* AltCo */
.altco-about-text {
  max-width: 88%;
  margin-left: auto;
  margin-right: auto;
}

.altco-about-text .danah-text-p {
  margin-bottom: 0;
}

.altco-brands-heading {
  margin-top: 5.5%;
  margin-bottom: 0;
}

.altco-brands-section {
  background-color: var(--page-bg, #F8F0EB);
  padding-top: max(3.5vw, 28px);
  padding-bottom: 120px;
}

@media (max-width: 991px) {
  .altco-brands-section {
    padding-bottom: 40px;
  }
}

.altco-brands-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 1.77vw;
  row-gap: 1.25vw;
}

.altco-brand-card {
  background: #FFFFFF;
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

.altco-brand-card img {
  height: auto;
  display: block;
}

@media (max-width: 767px) {
  .brand-body-left {
    padding-left: 0;
    padding-right: 0;
  }
  .altco-about-text {
    max-width: 100%;
  }
}

/* ==========================================
   OUR BUSINESS SECTORS PAGE
========================================== */
.bs-hero {
  background: #F4EACF;
  line-height: 0;
}

.bs-hero-img {
  width: 100%;
  height: auto;
  display: block;
}

.bs-stats-bar {
  background-color: #173128;
  padding: 36px 0;
}

.bs-stats-bar .stats-container {
  justify-content: center;
  gap: 14px 3.6vw;
}

.bs-about-section {
  background-color: var(--page-bg, #F8F0EB);
  padding: 105px 0 40px;
}

.bs-about-text {
  padding-left: 4.8%;
  padding-right: 2%;
}

.bs-about-text p {
  font-family: var(--font-main, 'Poppins', sans-serif);
  font-size: 1.8rem;
  line-height: 1.6;
  color: #302F36;
  margin-bottom: 1.6em;
}

.bs-about-text p:last-child {
  margin-bottom: 0;
}

.bs-sectors-section {
  padding-top: 70px;
}

.bs-brands-strip-section {
  background-color: var(--page-bg, #F8F0EB);
  padding: 40px 0 140px;
}

.bs-brand-strip {
  border-radius: 0;
  border: 0;
  box-shadow: none;
}

.bs-brand-strip .carousel-arrow {
  display: none;
}

@media (max-width: 991px) {
  .bs-about-section { padding-top: 50px; }
  .bs-about-text { padding-left: 0; padding-right: 0; }
  .bs-about-text p { font-size: 1.25rem; }
  .bs-brands-strip-section { padding-bottom: 60px; }
}

@media (max-width: 576px) {
  .bs-stats-bar { padding: 18px 0; }
  .bs-about-text p { font-size: 1.05rem; }
}

/* ==========================================
   NEWSLETTERS PAGE
========================================== */
.nl-section {
  background-color: var(--page-bg, #F8F0EB);
  padding: 125px 0 1190px;
}

.nl-card {
  background: #FAFAFA;
  border-radius: 6px;
  padding: 30px 22px 30px;
}

.nl-title {
  font-family: var(--font-main, 'Poppins', sans-serif);
  font-size: 1.6rem;
  font-weight: 600;
  color: #173128;
  margin: 0 0 22px;
}

.nl-tabs {
  margin: 0 8px;
  border-bottom: 1px solid #E8E8E8;
  gap: 4px;
}

.nl-tab {
  background: transparent;
  border: 0;
  border-radius: 3px 3px 0 0;
  padding: 7px 17px;
  font-family: var(--font-main, 'Poppins', sans-serif);
  font-size: 0.95rem;
  color: #302F36;
}

.nl-tab.active {
  background: #173128;
  color: #FFFFFF;
  font-weight: 600;
}

.nl-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin: 39px 8px 0;
}

.nl-month {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 266px;
  height: 119px;
  background: #173128;
  color: #FFFFFF;
  font-family: var(--font-main, 'Poppins', sans-serif);
  font-size: 2rem;
  font-weight: 600;
  text-decoration: none;
}

.nl-month:hover {
  color: #FFFFFF;
  background: var(--primary-green-hover, #183327);
}

@media (max-width: 991px) {
  .nl-section { padding: 70px 0 360px; }
}

@media (max-width: 576px) {
  .nl-section { padding: 40px 0 120px; }
  .nl-month { width: 100%; }
}

/* ==========================================
   BRAND PAGES (RESTAURANTS & CAFES)
========================================== */

/* Wider logo card (Meatchops, Odachi) */
.danah-logo-card.brand-card-wide {
  max-width: 795px;
  min-height: 390px;
}

/* Collage column holding stacked photos; children are sized
   relative to the column */
.brand-collage-col {
  flex: 0 0 auto;
  width: var(--w);
  margin-left: var(--ml, 0);
  margin-top: var(--mt, 0);
}

/* Body text with padding measured from the design */
.brand-body-free {
  padding-left: var(--pl, 0);
  padding-right: var(--pr, 0);
}

/* Text card sitting beside a photo (GIA) */
.brand-text-card {
  align-self: stretch;
  background: #FAFAFA;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: var(--pl, 0);
  padding-right: var(--pr, 0);
}

.brand-text-card .danah-text-p:last-child {
  margin-bottom: 0;
}

.brand-sub-heading {
  font-family: var(--font-main, 'Poppins', sans-serif);
  font-size: 2.35rem;
  font-weight: 600;
  color: #333333;
  margin-bottom: 4px;
}

.brand-sub-heading-sm {
  font-size: 2.05rem;
  font-weight: 500;
  margin-bottom: 20px;
}

@media (max-width: 1399px) {
  .brand-sub-heading { font-size: 1.95rem; }
  .brand-sub-heading-sm { font-size: 1.7rem; }
}

@media (max-width: 991px) {
  .danah-logo-card.brand-card-wide {
    min-height: 285px;
  }
  .brand-sub-heading { font-size: 1.5rem; }
  .brand-sub-heading-sm { font-size: 1.35rem; margin-bottom: 12px; }
  .brand-text-card .danah-text-p {font-size: 1rem;}
}

@media (max-width: 576px) {
  .danah-logo-card.brand-card-wide {
    min-height: 215px;
  }
  .brand-text-card .danah-text-p {font-size: .9rem;line-height: 1.6;}
  .brand-text-card .danah-text-p {
        font-size: .7rem;
        line-height: 1.6;
    }
   
}

/* Brand slider logos link to their brand pages */
.brand-logo-link { display: contents; }

.altco-brand-card[data-brand-key] {
  cursor: pointer;
}

/* Tighter gap between the ALTCO BRANDS heading and the logo grid */
section:has(> .container > .altco-brands-heading),
section:has(.altco-brands-heading) {
  padding-bottom: 0 !important;
}