/* Kiln - Simple, All-Inclusive Pricing section.
   Applies wherever the pricing section sits on the forest-green background. */

/* ---- CTA buttons: filled off-white with dark green text; inverts on hover ---- */
.has-forest-green-bg-white-text .membership-level__cost a {
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 26px; border:2px solid #FBF6F0;
  background-color:#FBF6F0; color:#1B2920 !important;
  text-decoration:none !important; line-height:1.2;
  transition:background-color .15s ease,color .15s ease,border-color .15s ease; }

.has-forest-green-bg-white-text .kiln-ornd-btn a {
  display:flex; align-items:center; justify-content:center;
  width:100%; box-sizing:border-box;
  padding:13px 26px; border:2px solid #FBF6F0;
  background-color:#FBF6F0; color:#1B2920 !important;
  text-decoration:none !important; line-height:1.2;
  transition:background-color .15s ease,color .15s ease,border-color .15s ease; }

.has-forest-green-bg-white-text .membership-level__cost a::after,
.has-forest-green-bg-white-text .kiln-ornd-btn a::after { color:inherit; }

.has-forest-green-bg-white-text .membership-level__cost a:hover,
.has-forest-green-bg-white-text .membership-level__cost a:focus-visible,
.has-forest-green-bg-white-text .kiln-ornd-btn a:hover,
.has-forest-green-bg-white-text .kiln-ornd-btn a:focus-visible {
  background-color:#1B2920; border-color:#FBF6F0; color:#FBF6F0 !important; }

/* Inquire CTAs sit as their own column block; match the nested Buy CTAs exactly */
.has-forest-green-bg-white-text .vc_column-inner > .wpb_wrapper > .kiln-ornd-btn {
  margin-top:25px !important; margin-bottom:0 !important; }

/* ---- Price on the same line as the plan name at every width ---- */
.has-forest-green-bg-white-text .membership-level {
  flex-wrap:nowrap !important; justify-content:space-between !important;
  align-items:baseline !important; gap:12px; }
.has-forest-green-bg-white-text .membership-level__title,
.has-forest-green-bg-white-text .membership-level__cost {
  flex:0 1 auto !important; max-width:none !important; }
.has-forest-green-bg-white-text .membership-level__cost {
  text-align:right !important; white-space:nowrap; }

/* ---- Pricing grid dividers ---- */
.vc_row.kiln-pricing-row-top { border-bottom:1px solid #FBF6F0; }

/* tighten the header block above the cards */
.vc_row.kiln-pricing-head .wpb_text_column { margin-bottom:0 !important; }
.vc_row.kiln-pricing-head { margin-bottom:2% !important; }

@media (min-width:768px) {
  /* vertical rule down the gutter; the 17.5px column padding gives even
     clearance either side of the crossing */
  .vc_row.kiln-pricing-row > .wpb_column:not(:last-child) { border-right:1px solid #FBF6F0; }
  .vc_row.kiln-pricing-row-top { margin-bottom:0 !important; }
}

@media (max-width:767px) {
  /* cards stack, so the rule between each pair runs horizontally instead */
  .vc_row.kiln-pricing-row > .wpb_column:not(:last-child) {
    border-bottom:1px solid #FBF6F0; padding-bottom:39px !important; }
  /* even rhythm between the stacked cards */
  .vc_row.kiln-pricing-row > .wpb_column { margin-bottom:20px; }
  .vc_row.kiln-pricing-row-top { margin-bottom:25px !important; }
}

/* ---- Cards built with WPBakery buttons (Bozeman-style) ---- */
/* there the description and CTA sit side by side; stack them so the button
   spans the card the same way it does elsewhere */
.kiln-pricing-row .vc_row.vc_inner > .wpb_column { width:100% !important; }
.kiln-pricing-row .vc_btn3-container { margin:25px 0 0 !important; }
.kiln-pricing-row .vc_btn3-container .vc_btn3 {
  display:flex !important; align-items:center; justify-content:center;
  width:100% !important; box-sizing:border-box;
  padding:13px 26px !important;
  border:2px solid #FBF6F0 !important;
  background-color:#FBF6F0 !important; color:#1B2920 !important;
  text-decoration:none !important; line-height:1.2;
  transition:background-color .15s ease,color .15s ease,border-color .15s ease; }
.kiln-pricing-row .vc_btn3-container .vc_btn3:hover,
.kiln-pricing-row .vc_btn3-container .vc_btn3:focus-visible {
  background-color:#1B2920 !important; border-color:#FBF6F0 !important;
  color:#FBF6F0 !important; }

/* balanced padding on the pricing band (beats WPBakery has-fill default) */
.vc_section.kiln-pricing-section { padding-top:25px !important; padding-bottom:25px !important; }
@media (min-width:1000px) {
  .vc_section.kiln-pricing-section { padding-top:4% !important; padding-bottom:4% !important; }
}
/* the bottom row carries its own trailing padding on some pages; the section
   padding handles that now */
.vc_row.kiln-pricing-row-bottom { margin-bottom:0 !important; padding-bottom:0 !important; }

/* Very narrow phones (<=359px): a long price and the plan name cannot share
   a line without breaking the title, so stack them at that size only. */
@media (max-width:359px) {
  .has-forest-green-bg-white-text .membership-level { flex-wrap:wrap !important; }
  .has-forest-green-bg-white-text .membership-level__title,
  .has-forest-green-bg-white-text .membership-level__cost {
    flex:1 1 100% !important; text-align:left !important; }
}

/* Two pages have price strings long enough to squeeze the plan name above
   360px, so they stack at a wider breakpoint: Fremont (From $12,225/mo)
   and Anaheim (Inquire for pricing.). */
@media (max-width:383px) {
  body.page-id-5874 .has-forest-green-bg-white-text .membership-level { flex-wrap:wrap !important; }
  body.page-id-5874 .has-forest-green-bg-white-text .membership-level__title,
  body.page-id-5874 .has-forest-green-bg-white-text .membership-level__cost {
    flex:1 1 100% !important; text-align:left !important; }
}
@media (max-width:389px) {
  body.page-id-5980 .has-forest-green-bg-white-text .membership-level { flex-wrap:wrap !important; }
  body.page-id-5980 .has-forest-green-bg-white-text .membership-level__title,
  body.page-id-5980 .has-forest-green-bg-white-text .membership-level__cost {
    flex:1 1 100% !important; text-align:left !important; }
}

/* ---- Amenities: tie each category heading to its own list ----
   Group separation comes from the theme's 38.76px padding-top on
   .wpb_text_column; only the heading-to-list gap needs tightening. ---- */
.wpb_text_column:has(+ .kiln-vc-icon-list){ margin-bottom:12px !important; }
.kiln-vc-icon-list{ margin-bottom:0 !important; }

/* ---- Three-across pricing rows (locations without a Studios tier):
   columns are ~245px on tablet, so stack the price under the plan name ---- */
@media (max-width:999px){
  .kiln-pricing-row > .wpb_column:first-child:nth-last-child(3) .membership-level,
  .kiln-pricing-row > .wpb_column:first-child:nth-last-child(3) ~ .wpb_column .membership-level { flex-wrap:wrap !important; }
  .kiln-pricing-row > .wpb_column:first-child:nth-last-child(3) .membership-level__title,
  .kiln-pricing-row > .wpb_column:first-child:nth-last-child(3) ~ .wpb_column .membership-level__title,
  .kiln-pricing-row > .wpb_column:first-child:nth-last-child(3) .membership-level__cost,
  .kiln-pricing-row > .wpb_column:first-child:nth-last-child(3) ~ .wpb_column .membership-level__cost {
    flex:1 1 100% !important; text-align:left !important; }
}