/* ===== patterns + ACF blocks (appended) ===== */
/* Beautyforest — appended block/ACF styles */

/* ===========================================================
   Brands A–Z directory  (.bf-brands)
   =========================================================== */
.bf-brands{
  margin:0;
}
.bf-brands__group{
  margin:0 0 2rem;
}
.bf-brands__letter{
  font-family:var(--wp--preset--font-family--heading);
  color:var(--bf-forest);
  margin:0 0 .75rem;
  padding-bottom:.4rem;
  border-bottom:1px solid var(--bf-hairline);
  font-size:1.5rem;
  line-height:1.1;
}
.bf-brands__list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:1fr;
  gap:.5rem 1.5rem;
}
.bf-brands__item{
  margin:0;
}
.bf-brands__item a{
  color:var(--bf-graphite);
  text-decoration:none;
  transition:color .18s ease;
}
.bf-brands__item a:hover,
.bf-brands__item a:focus-visible{
  color:var(--bf-forest);
  text-decoration:underline;
}
.bf-brands__count{
  color:var(--bf-stone-deep);
  font-size:.85em;
  margin-left:.35rem;
}

@media (min-width:560px){
  .bf-brands__list{
    grid-template-columns:repeat(2,1fr);
  }
}
@media (min-width:781px){
  .bf-brands__list{
    grid-template-columns:repeat(3,1fr);
  }
}
@media (min-width:1024px){
  .bf-brands__list{
    grid-template-columns:repeat(4,1fr);
  }
}

/* ===========================================================
   Brand strip  (.bf-acf-brandstrip)
   =========================================================== */
.bf-acf-brandstrip{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:1.5rem 2.5rem;
  padding:1.5rem clamp(1rem,5vw,2rem);
}
.bf-acf-brandstrip__heading{
  font-family:var(--wp--preset--font-family--heading);
  color:var(--bf-graphite);
  text-align:center;
  width:100%;
  margin:0 0 .75rem;
}
.bf-acf-brandstrip a{
  display:inline-flex;
  align-items:center;
  line-height:0;
}
.bf-acf-brandstrip img{
  max-height:40px;
  width:auto;
  filter:grayscale(1);
  opacity:.65;
  transition:filter .2s ease,opacity .2s ease;
}
.bf-acf-brandstrip a:hover img,
.bf-acf-brandstrip a:focus-visible img{
  filter:grayscale(0);
  opacity:1;
}

/* ===========================================================
   Editorial CTA  (.bf-acf-editorial)
   =========================================================== */
.bf-acf-editorial{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(1.5rem,4vw,3rem);
  align-items:center;
  padding:clamp(2rem,5vw,3.5rem) clamp(1rem,5vw,2rem);
}
.bf-acf-editorial__media{
  margin:0;
}
.bf-acf-editorial__media img{
  display:block;
  width:100%;
  height:auto;
  border-radius:var(--bf-radius);
}
.bf-acf-editorial__body{
  margin:0;
}
.bf-acf-editorial__eyebrow{
  font-weight:700;
  font-size:.78rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--bf-forest);
  margin:0 0 .6rem;
}
.bf-acf-editorial__heading{
  font-family:var(--wp--preset--font-family--heading);
  color:var(--bf-graphite);
  margin:0 0 .75rem;
}
.bf-acf-editorial__text{
  color:var(--bf-stone-deep);
  margin:0 0 1.25rem;
}

@media (min-width:781px){
  .bf-acf-editorial{
    grid-template-columns:1fr 1fr;
  }
  .bf-acf-editorial--image-left .bf-acf-editorial__media{
    order:-1;
  }
}

/* ===========================================================
   Product carousel  (.bf-acf-carousel)
   =========================================================== */
.bf-acf-carousel{
  padding:clamp(2rem,5vw,3rem) clamp(1rem,5vw,2rem);
}
.bf-acf-carousel__heading{
  font-family:var(--wp--preset--font-family--heading);
  color:var(--bf-graphite);
  margin:0 0 1.25rem;
}
.bf-carousel__track{
  list-style:none;
  margin:0;
  padding:0 0 .5rem;
  display:flex;
  gap:1rem;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
  scrollbar-color:var(--bf-hairline) transparent;
}
.bf-carousel__track li.product{
  flex:0 0 240px;
  scroll-snap-align:start;
  margin:0;
}
.bf-carousel__track::-webkit-scrollbar{
  height:8px;
}
.bf-carousel__track::-webkit-scrollbar-track{
  background:transparent;
}
.bf-carousel__track::-webkit-scrollbar-thumb{
  background:var(--bf-hairline);
  border-radius:var(--bf-radius);
}
.bf-carousel__track::-webkit-scrollbar-thumb:hover{
  background:var(--bf-stone-deep);
}

/* brand-strip row structure */
.bf-acf-brandstrip__row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:1.25rem 2.25rem;width:100%}
.bf-acf-brandstrip__item{display:inline-flex;align-items:center;line-height:0}
.bf-acf-brandstrip__logo{max-height:40px;width:auto;filter:grayscale(1);opacity:.65;transition:filter .2s ease,opacity .2s ease}
.bf-acf-brandstrip__item:hover .bf-acf-brandstrip__logo,.bf-acf-brandstrip__item:focus-visible .bf-acf-brandstrip__logo{filter:grayscale(0);opacity:1}

/* (header layout consolidated into the Header section above) */

/* ===========================================================
   Popular ranges  (.bf-acf-popular)
   =========================================================== */
.bf-acf-popular{
  box-sizing:border-box;
  --bf-popular-bg:var(--bf-mint);
  background:var(--bf-popular-bg);
  border-radius:var(--bf-radius);
  padding:clamp(2rem,5vw,3.5rem) clamp(1rem,5vw,2.5rem);
}
.bf-acf-popular--bg-mint{--bf-popular-bg:var(--bf-mint)}
.bf-acf-popular--bg-paper{--bf-popular-bg:var(--bf-paper)}
.bf-acf-popular--bg-graphite{--bf-popular-bg:var(--bf-graphite)}
.bf-acf-popular__heading{
  font-family:var(--wp--preset--font-family--heading);
  color:var(--bf-graphite);
  text-align:left;
  font-size:clamp(1.5rem,1.1rem + 1.4vw,2.1rem);
  margin:0 0 clamp(1.5rem,3vw,2.25rem);
}
.bf-acf-popular--bg-graphite .bf-acf-popular__heading{color:var(--bf-paper)}
.bf-acf-popular__grid{
  list-style:none;
  margin:0 auto;
  padding:0;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:clamp(.9rem,2.2vw,1.5rem);
}
.bf-acf-popular__item{margin:0;min-width:0;display:flex}
/* rectangular, slightly-3D card — icon + name stacked */
.bf-acf-popular__card{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.9rem;
  width:100%;
  box-sizing:border-box;
  text-align:center;
  text-decoration:none;
  padding:clamp(1.4rem,3vw,2rem) 1rem;
  background:#fff;
  border:1px solid var(--bf-hairline);
  border-top-color:#fff;
  border-radius:var(--bf-radius);
  color:var(--bf-graphite);
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset, 0 12px 22px -14px rgba(8,36,15,.34), 0 3px 6px -3px rgba(8,36,15,.16);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.bf-acf-popular__card:hover,
.bf-acf-popular__card:focus-visible{
  transform:translateY(-4px);
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset, 0 24px 38px -16px rgba(8,36,15,.46), 0 6px 12px -4px rgba(8,36,15,.22);
  border-color:var(--bf-green);
}
.bf-acf-popular__image{
  width:clamp(60px,11vw,84px);
  aspect-ratio:1;
  flex:0 0 auto;
  border-radius:var(--bf-radius);
  overflow:hidden;
  background:var(--bf-mint);
  display:flex;
  align-items:center;
  justify-content:center;
}
.bf-acf-popular__image img{width:100%;height:100%;object-fit:cover;display:block}
.bf-acf-popular__label{
  font-weight:600;
  font-size:.95rem;
  line-height:1.25;
  color:var(--bf-graphite);
}
.bf-acf-popular__card:hover .bf-acf-popular__label{color:var(--bf-forest)}
@media (prefers-reduced-motion:reduce){
  .bf-acf-popular__card{transition:none}
  .bf-acf-popular__card:hover,
  .bf-acf-popular__card:focus-visible{transform:none}
}

/* ===========================================================
   Welcome / brand intro  (.bf-welcome)
   =========================================================== */
.bf-welcome{
  box-sizing:border-box;
  background:var(--bf-welcome-bg,var(--bf-paper));
  border-radius:var(--bf-radius);
  padding:clamp(1.75rem,4vw,3rem);
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-areas:"img main" "last last";
  gap:clamp(1.5rem,4vw,3rem) clamp(1.5rem,4vw,3.5rem);
  align-items:center;
}
.bf-welcome--bg-paper{--bf-welcome-bg:var(--bf-paper)}
.bf-welcome--bg-mint{--bf-welcome-bg:var(--bf-mint)}
.bf-welcome--bg-white{--bf-welcome-bg:#fff}
.bf-welcome--bg-graphite{--bf-welcome-bg:var(--bf-graphite)}
.bf-welcome--img-right{grid-template-areas:"main img" "last last"}
.bf-welcome--no-image{grid-template-columns:1fr;grid-template-areas:"main" "last"}
.bf-welcome__img{grid-area:img;align-self:stretch}
.bf-welcome__img img{width:100%;height:100%;min-height:300px;object-fit:cover;border-radius:var(--bf-radius);display:block}
.bf-welcome__main{grid-area:main}
.bf-welcome__heading{
  font-family:var(--wp--preset--font-family--heading);
  color:var(--bf-graphite);
  font-size:clamp(1.75rem,1.2rem + 1.8vw,2.75rem);
  line-height:1.1;letter-spacing:-.01em;margin:0 0 1rem;
}
.bf-welcome__heading span{color:var(--bf-forest)}
.bf-welcome__body{color:var(--bf-stone-deep);font-size:1.05rem;line-height:1.7}
.bf-welcome__body p{margin:0 0 1rem}
.bf-welcome__body p:last-child{margin-bottom:0}
.bf-welcome__lastline{
  grid-area:last;margin:0;padding-top:clamp(1.25rem,3vw,1.75rem);
  border-top:1px solid var(--bf-hairline);
  color:var(--bf-graphite);font-size:1.05rem;font-weight:500;line-height:1.6;
}
.bf-welcome--bg-graphite .bf-welcome__heading,
.bf-welcome--bg-graphite .bf-welcome__lastline{color:#fff}
.bf-welcome--bg-graphite .bf-welcome__body{color:#cdd6cf}
.bf-welcome--bg-graphite .bf-welcome__heading span{color:var(--bf-green)}
.bf-welcome--bg-graphite .bf-welcome__lastline{border-top-color:rgba(255,255,255,.18)}
@media (max-width:781px){
  .bf-welcome{grid-template-columns:1fr;grid-template-areas:"img" "main" "last";gap:1.5rem}
  .bf-welcome--img-right{grid-template-areas:"img" "main" "last"}
  .bf-welcome__img img{min-height:0;aspect-ratio:16/10}
}

/* ===========================================================
   Service highlights / USP bar  (.bf-services)
   =========================================================== */
.bf-services{box-sizing:border-box;border-radius:var(--bf-radius);background:var(--bf-services-bg,transparent);padding:clamp(1.25rem,3vw,2rem) clamp(1rem,4vw,2rem)}
.bf-services--bg-none{--bf-services-bg:transparent;padding-inline:0}
.bf-services--bg-mint{--bf-services-bg:var(--bf-mint)}
.bf-services--bg-paper{--bf-services-bg:var(--bf-paper)}
.bf-services--bg-white{--bf-services-bg:#fff}
.bf-services--bg-graphite{--bf-services-bg:var(--bf-graphite)}
.bf-services__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,3vw,2rem)}
.bf-services__item{margin:0;min-width:0}
.bf-services__headline{display:flex;align-items:center;gap:.65rem;margin-bottom:.3rem}
.bf-services__icon{flex:0 0 auto;color:var(--bf-green);display:inline-flex}
.bf-services__icon svg{display:block}
.bf-services__headline h3{margin:0;font-family:var(--wp--preset--font-family--body);font-size:1rem;font-weight:700;line-height:1.2;color:var(--bf-graphite);letter-spacing:0}
.bf-services__text{margin:0;color:var(--bf-stone-deep);font-size:.9rem;line-height:1.45}
.bf-services--bg-graphite .bf-services__headline h3{color:#fff}
.bf-services--bg-graphite .bf-services__text{color:#cdd6cf}
@media (max-width:899px){.bf-services__list{grid-template-columns:repeat(2,1fr);gap:1.5rem 1.25rem}}
@media (max-width:520px){.bf-services__list{grid-template-columns:1fr}}

/* carousel head + arrow navigation */
.bf-acf-carousel__head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:0 0 1.25rem}
.bf-acf-carousel__head .bf-acf-carousel__heading{margin:0}
.bf-acf-carousel__nav{display:flex;gap:.5rem;flex:0 0 auto}
.bf-acf-carousel__nav[hidden]{display:none}
.bf-acf-carousel__arrow{width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--bf-hairline);border-radius:var(--bf-radius);background:#fff;color:var(--bf-graphite);cursor:pointer;
  transition:background .18s ease,color .18s ease,border-color .18s ease,opacity .18s ease}
.bf-acf-carousel__arrow:hover:not(:disabled){background:var(--bf-green);border-color:var(--bf-green);color:var(--bf-green-ink)}
.bf-acf-carousel__arrow:disabled{opacity:.35;cursor:default}
.bf-acf-carousel__arrow svg{display:block}
