/*
 * Better Bond native Elementor edition — supplementary detail styles only.
 * Layout, spacing, typography, imagery, backgrounds, borders, grid and form
 * design are stored in editable Elementor controls / global kit settings.
 * No render bridge, no display:contents wrapper emulation, no form handler.
 */

/* The approved prototype uses OS fonts, not downloadable font files. Native
   typography controls keep their selected family; these local aliases preserve
   the original fallback stacks on devices where that first family is absent.
   No font is bundled, fetched or forced onto unrelated Elementor widgets. */
@font-face {
  font-family: "Iowan Old Style";
  font-style: normal;
  font-weight: 400;
  src: local("Iowan Old Style"), local("IowanOldStyle-Roman"), local("Palatino Linotype"), local("Palatino"), local("Baskerville"), local("Georgia");
}
@font-face {
  font-family: "Iowan Old Style";
  font-style: normal;
  font-weight: 700;
  src: local("Iowan Old Style Bold"), local("IowanOldStyle-Bold"), local("Palatino Linotype Bold"), local("Palatino Bold"), local("Baskerville Bold"), local("Georgia Bold");
}
@font-face {
  font-family: "Iowan Old Style";
  font-style: italic;
  font-weight: 400;
  src: local("Iowan Old Style Italic"), local("IowanOldStyle-Italic"), local("Palatino Linotype Italic"), local("Palatino Italic"), local("Baskerville Italic"), local("Georgia Italic");
}
@font-face {
  font-family: "Avenir Next";
  font-style: normal;
  font-weight: 500;
  src: local("Avenir Next Medium"), local("AvenirNext-Medium"), local("Avenir Medium"), local("Segoe UI"), local("Helvetica"), local("Arial");
}
@font-face {
  font-family: "Avenir Next";
  font-style: normal;
  font-weight: 400;
  src: local("Avenir Next Regular"), local("AvenirNext-Regular"), local("Avenir"), local("Segoe UI"), local("Helvetica"), local("Arial");
}
@font-face {
  font-family: "Avenir Next";
  font-style: normal;
  font-weight: 600;
  src: local("Avenir Next Demi Bold"), local("AvenirNext-DemiBold"), local("Avenir Heavy"), local("Segoe UI Semibold"), local("Helvetica Bold"), local("Arial Bold");
}
@font-face {
  font-family: "Avenir Next";
  font-style: normal;
  font-weight: 700;
  src: local("Avenir Next Bold"), local("AvenirNext-Bold"), local("Avenir Black"), local("Segoe UI Bold"), local("Helvetica Bold"), local("Arial Bold");
}
@font-face {
  font-family: "Avenir Next Condensed";
  font-style: normal;
  font-weight: 400;
  src: local("Avenir Next Condensed Regular"), local("AvenirNextCondensed-Regular"), local("Helvetica Neue"), local("Arial");
}

body.bb-native-v2 {
  --bb-forest: var(--e-global-color-forest, #1d5143);
  --bb-forest-deep: var(--e-global-color-forestdeep, #123a31);
  --bb-cream: var(--e-global-color-cream, #f3eadc);
  --bb-paper: var(--e-global-color-paper, #fbf7ef);
  --bb-sage-light: var(--e-global-color-sagelight, #e4e6d8);
  --bb-sand: var(--e-global-color-sand, #cda77d);
  --bb-rust: var(--e-global-color-rust, #a5523b);
  --bb-line: rgba(29, 81, 67, 0.18);
  -webkit-font-smoothing: antialiased;
}
/* A targeted blog conversion does not replace the site's global kit. Keep the
   approved article background with a normal editable global-colour fallback. */
body.bb-native-v2.bb-native-blog-host {
  background-color: var(--e-global-color-paper, #fbf7ef);
  color: var(--e-global-color-ink, #183a32);
}

/* The source contains editorial line breaks. Native heading text retains the
   spans so the customer can edit those breaks alongside the heading itself. */
.bb-native-v2 .home-hero .elementor-heading-title > span,
.bb-native-v2 .recognition .elementor-heading-title > span,
.bb-native-v2 .home-approach-copy .elementor-heading-title > span,
.bb-native-v2 .instagram-copy .elementor-heading-title > span,
.bb-native-v2 .approach-hero .elementor-heading-title > span,
.bb-native-v2 .foundation-copy .elementor-heading-title > span,
.bb-native-v2 .training-hero .elementor-heading-title > span,
.bb-native-v2 .about-hero-copy .elementor-heading-title > span,
.bb-native-v2 .knowledge-hero .elementor-heading-title > span,
.bb-native-v2 .social-hero .elementor-heading-title > span,
.bb-native-v2 .extra-hero .elementor-heading-title > span {
  display: block;
}
.bb-native-v2 .home-hero .elementor-heading-title em { color: var(--bb-rust); }
.bb-native-v2 .bb-native-text.elementor-widget-text-editor p:first-child { margin-top: 0; }
.bb-native-v2 .bb-native-text.elementor-widget-text-editor p:last-child { margin-bottom: 0; }
.bb-native-v2 .foundation-copy .elementor-heading-title > span,
.bb-native-v2 .knowledge-hero .elementor-heading-title > span,
.bb-native-v2 .training-hero .elementor-heading-title > span,
.bb-native-v2 .about-hero-copy .elementor-heading-title > span,
.bb-native-v2 .principles .section-heading .elementor-heading-title,
.bb-native-v2 .process .section-heading .elementor-heading-title,
.bb-native-v2 .offer-featured h3.elementor-heading-title { white-space: nowrap; }

/* Source hover motion supplements the native editable button colours. */
.bb-native-v2 .button .elementor-button {
  transition: transform 180ms ease, background-color 180ms ease, color 180ms ease;
}
.bb-native-v2 .button .elementor-button:hover { transform: translateY(-2px); }
.bb-native-v2 .group-choice-card { transition: transform 180ms ease, box-shadow 180ms ease; }
.bb-native-v2 .group-choice-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 28px 75px rgba(30, 62, 52, 0.15);
}
.bb-native-v2 .starter-photo img { transform: scale(1.04); }

/* Native sticky positioning belongs to Elementor Pro. Only the scroll-driven
   palette switch and stacked-logo visibility require this extra state. */
.bb-native-v2 .site-header {
  backdrop-filter: blur(16px);
  transition: background-color 220ms ease, color 220ms ease, box-shadow 180ms ease, border-color 180ms ease;
}
body.bb-native-v2 .site-header:not(.scrolled) {
  background-color: var(--bb-forest-deep);
  color: var(--bb-cream);
}
.bb-native-v2 .site-header.scrolled {
  box-shadow: 0 12px 36px rgba(24, 58, 50, 0.07);
  border-bottom-color: var(--bb-line);
}
.bb-native-v2 .brand-on-dark,
.bb-native-v2 .brand-on-light { transition: opacity 220ms ease; }
.bb-native-v2 .brand-on-dark { opacity: 0; pointer-events: none; }
.bb-native-v2 .site-header:not(.scrolled) .brand-on-dark { opacity: 1; }
.bb-native-v2 .site-header:not(.scrolled) .brand-on-light { opacity: 0; }
.bb-native-v2 .site-header:not(.scrolled) .nav-cta .elementor-button {
  background-color: var(--bb-cream);
  color: var(--bb-forest-deep);
}
.bb-native-v2 .site-header:not(.scrolled) .nav-instagram .elementor-icon {
  color: var(--bb-cream);
  fill: var(--bb-cream);
}
.bb-native-v2 .site-header:not(.scrolled) .site-nav .elementor-nav-menu--main > .elementor-nav-menu > li > a {
  color: var(--bb-cream);
}
.bb-native-v2 .site-header:not(.scrolled) .site-nav .elementor-nav-menu--main > .elementor-nav-menu > li > a.elementor-item-active {
  color: var(--bb-sand);
}
.bb-native-v2 .site-header:not(.scrolled) .site-nav .elementor-nav-menu--main > .elementor-nav-menu > li > a::after {
  background-color: var(--bb-sand);
}
.bb-native-v2 .site-header:not(.scrolled) .site-nav .elementor-menu-toggle {
  background-color: transparent;
  color: var(--bb-cream);
  border-color: rgba(243, 234, 220, 0.3);
}

/* Three nested training pages are a real WordPress menu. Display its second
   level within the open panel, matching the original submenu grouping. */
.bb-native-v2 .site-nav .elementor-nav-menu--main .sub-menu .sub-menu {
  inset: auto;
  position: relative;
  margin: 0.2rem 0.6rem 0.55rem 1rem;
  padding-left: 0.6rem;
  border-left: 1px solid var(--bb-line);
  box-shadow: none;
}
.bb-native-v2 .site-nav .elementor-nav-menu--main .sub-menu .sub-menu a { white-space: normal; }

@media (min-width: 901px) {
  .bb-native-v2 .site-nav li.bb-mobile-contact { display: none; }
}
@media (max-width: 900px) {
  .bb-native-v2 .site-nav .elementor-nav-menu--dropdown .bb-mobile-contact > a {
    margin-top: 0.9rem;
    border-radius: 999px;
    background-color: var(--bb-forest);
    color: white;
  }
}

/* Decorative photo keyline and gradient have no single native widget control;
   dimensions, radius and crop remain entirely native settings. */
.bb-native-v2 .hero-image-wrap { inset: 0; }
/* Elementor image widgets insert a wrapper. Fill the native container height
   without imposing a new crop, width, radius or hard-coded image dimension. */
.bb-native-v2 :is(.starter-photo, .about-hero-image, .social-hero-photo) {
  height: var(--min-height, auto);
}
.bb-native-v2 :is(.hero-image-wrap, .starter-photo, .about-hero-image, .social-hero-photo, .training-action-photo, .roots-photo-frame) > .bb-native-image,
.bb-native-v2 :is(.hero-image-wrap, .starter-photo, .about-hero-image, .social-hero-photo, .training-action-photo, .roots-photo-frame) > .bb-native-image > .elementor-widget-container { height: 100%; }
.bb-native-v2 .training-action-photo { aspect-ratio: 4 / 5; }
.bb-native-v2 .hero-image-wrap::before {
  content: "";
  position: absolute;
  inset: 12px;
  z-index: 1;
  border: 1px solid rgba(255, 255, 255, 0.46);
  border-radius: inherit;
  pointer-events: none;
}
.bb-native-v2 .hero-image-wrap::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(18, 58, 49, 0.28), transparent 42%);
  pointer-events: none;
}

/* The native Toggle / Accordion widget controls opening/closing. This only
   centers its two SVG icons in the source's circular outline. */
.bb-native-v2 .faq-list .elementor-accordion-icon,
.bb-native-v2 .faq-list .elementor-toggle-icon {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border: 1px solid var(--bb-line);
  border-radius: 50%;
  transition: transform 180ms ease;
}
.bb-native-v2 .faq-list .elementor-tab-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
}
.bb-native-v2 .faq-list .elementor-accordion-icon,
.bb-native-v2 .faq-list .elementor-toggle-icon { order: 1; flex: 0 0 32px; }
.bb-native-v2 .faq-list .elementor-tab-title.elementor-active .elementor-accordion-icon,
.bb-native-v2 .faq-list .elementor-tab-title.elementor-active .elementor-toggle-icon { transform: rotate(45deg); }
.bb-native-v2 .faq-list .elementor-accordion-item,
.bb-native-v2 .faq-list .elementor-toggle-item { border-top: 0; border-inline: 0; }
.bb-native-v2 .faq-list .elementor-accordion-icon span,
.bb-native-v2 .faq-list .elementor-toggle-icon span {
  line-height: 0;
}
.bb-native-v2 .faq-list .elementor-accordion-icon svg,
.bb-native-v2 .faq-list .elementor-toggle-icon svg {
  width: 12px;
  height: 12px;
}

/* The native Form widget owns submission, spam checks, validation and messages.
   Pills below decorate only radio / acceptance option labels. */
.bb-native-v2 .contact-form-card .elementor-field-type-radio .elementor-field-subgroup {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}
.bb-native-v2 .contact-form-card .elementor-field-type-radio .elementor-field-option {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.55rem 0.75rem;
  border: 1px solid var(--bb-line);
  border-radius: 999px;
  background-color: rgba(255, 255, 255, 0.54);
}
.bb-native-v2 .contact-form-card .elementor-field-type-radio input,
.bb-native-v2 .contact-form-card .elementor-field-type-acceptance input { accent-color: var(--bb-forest); }
.bb-native-v2 .contact-form-card .elementor-field-type-radio label { cursor: pointer; }
.bb-native-v2 .contact-form-card .elementor-field-type-acceptance .elementor-field-option {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
}
.bb-native-v2 .contact-form-card textarea { resize: vertical; }
.bb-native-v2 .contact-form-card .elementor-message { line-height: 1.5; }

/* Native mixed-content containers remain visible while editing. Only inactive
   frontend slides are hidden, preserving their configured grid/flex layout. */
.bb-native-v2:not(.elementor-editor-active) .elementor-element[data-testimonial-slide][hidden],
.bb-native-v2:not(.elementor-editor-active) .elementor-element[data-approach-slide][hidden],
.bb-native-v2:not(.elementor-editor-active) .elementor-element[data-approach-controls][hidden] { display: none; }
.bb-native-v2 .approach-dots [data-approach-dot] .elementor-button { position: relative; }
.bb-native-v2 .approach-dots [data-approach-dot] .elementor-button::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 7px;
  height: 7px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background-color: var(--bb-forest);
  opacity: 0.35;
}
.bb-native-v2 .approach-dots [data-approach-dot][aria-current="true"] .elementor-button::after {
  width: 9px;
  height: 9px;
  opacity: 1;
}

/* Genuine WP post content inherits its native Theme Post Content settings.
   These typographic details apply to editorial content, not widget layout. */
.bb-native-v2 .blog-article-content :is(p, ul, ol) { margin-bottom: 1.4rem; }
.bb-native-v2 .blog-article-content a { text-underline-offset: 0.2em; }
.bb-native-v2 .blog-article-content li { margin-bottom: 0.6rem; }
.bb-native-v2 .blog-article-content figure { margin: 2.5rem 0; }
.bb-native-v2 .blog-article-content figcaption { margin-top: 0.6rem; }
.bb-native-v2 .blog-grid .elementor-post__thumbnail img { transition: transform 220ms ease; }
.bb-native-v2 .blog-grid .elementor-post:hover .elementor-post__thumbnail img { transform: scale(1.03); }
.bb-native-v2 .blog-grid .blog-card-image img { transition: transform 220ms ease; }
.bb-native-v2 .blog-grid .blog-card:hover .blog-card-image img { transform: scale(1.03); }

.bb-native-v2 :is(a, button, summary, input, select, textarea):focus-visible {
  outline: 3px solid rgba(165, 82, 59, 0.34);
  outline-offset: 3px;
}

@media (max-width: 640px) {
  /* The source caption is centered on its native 50% horizontal offset. */
  .bb-native-v2 .image-caption { transform: translateX(-50%); white-space: nowrap; }
  .bb-native-v2 .process .section-heading .elementor-heading-title,
  .bb-native-v2 .offer-featured h3.elementor-heading-title { white-space: normal; }
  .bb-native-v2 .home-hero .elementor-heading-title > span,
  .bb-native-v2 .recognition .elementor-heading-title > span,
  .bb-native-v2 .home-approach-copy .elementor-heading-title > span,
  .bb-native-v2 .instagram-copy .elementor-heading-title > span { display: inline; }
  .bb-native-v2 .home-hero .elementor-heading-title > span::after,
  .bb-native-v2 .recognition .elementor-heading-title > span::after,
  .bb-native-v2 .home-approach-copy .elementor-heading-title > span::after,
  .bb-native-v2 .instagram-copy .elementor-heading-title > span::after { content: " "; }
}

@media (prefers-reduced-motion: reduce) {
  .bb-native-v2 .site-header,
  .bb-native-v2 .brand-on-dark,
  .bb-native-v2 .brand-on-light,
  .bb-native-v2 .button .elementor-button,
  .bb-native-v2 .group-choice-card,
  .bb-native-v2 .faq-list .elementor-accordion-icon,
  .bb-native-v2 .faq-list .elementor-toggle-icon,
  .bb-native-v2 .blog-grid .elementor-post__thumbnail img { transition-duration: 0s; }
  .bb-native-v2 .button .elementor-button:hover,
  .bb-native-v2 .group-choice-card:hover { transform: none; }
}