/* ==========================================================================
   BAC Elementor — WordPress + Elementor integration layer
   Loaded after theme.css
   ========================================================================== */

.screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  white-space: nowrap;
}

/* WordPress admin bar offsets */
body.admin-bar .site-header {
  top: 32px;
}

body.admin-bar .nav {
  top: calc(var(--header-h) + 32px);
}

@media (max-width: 782px) {
  body.admin-bar .site-header {
    top: 46px;
  }

  body.admin-bar .nav {
    top: calc(var(--header-h) + 46px);
  }
}

/* ---------- WP menu markup ---------- */
.nav-list {
  display: flex;
  align-items: center;
  gap: 38px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.nav-list li {
  margin: 0;
  position: relative;
}

.nav-list a {
  position: relative;
  display: inline-block;
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 500;
  color: var(--ink-700);
  padding: 6px 0;
  transition: color 0.22s var(--ease);
}

.nav-list a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 2px;
  background: var(--brand);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.28s var(--ease);
}

.nav-list a:hover,
.nav-list .current-menu-item > a,
.nav-list .current_page_item > a,
.nav-list .current-menu-ancestor > a {
  color: var(--ink);
}

.nav-list a:hover::after,
.nav-list .current-menu-item > a::after,
.nav-list .current_page_item > a::after {
  transform: scaleX(1);
}

@media (max-width: 920px) {
  .nav-list {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    width: 100%;
  }

  .nav-list li {
    border-bottom: 1px solid var(--line);
  }

  .nav-list a {
    display: block;
    padding: 16px 0;
    font-size: 16px;
  }

  .nav-list a::after {
    display: none;
  }

  .nav-list .current-menu-item > a,
  .nav-list .current_page_item > a {
    color: var(--brand-700);
  }
}

/* ---------- Elementor global helpers ---------- */
.bac-on-dark h1,
.bac-on-dark h2,
.bac-on-dark h3,
.bac-on-dark h4 {
  color: var(--ink);
}

.bac-on-light h1,
.bac-on-light h2,
.bac-on-light h3 {
  color: var(--ink);
}

/* Eyebrow label — supports Elementor 3 (.elementor-widget-container)
   and Elementor 4 (text rendered directly inside the widget wrapper). */
.elementor-widget-text-editor.bac-eyebrow {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #b4501f;
}

.elementor-widget-text-editor.bac-eyebrow::before {
  content: "";
  width: 26px;
  height: 1px;
  background: currentColor;
  opacity: 0.7;
  flex: none;
}

.elementor-widget-text-editor.bac-eyebrow .elementor-widget-container,
.elementor-widget-text-editor.bac-eyebrow p {
  margin: 0;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
}

.bac-on-dark .elementor-widget-text-editor.bac-eyebrow {
  color: var(--brand-700);
}

/* Headings */
.elementor-widget-heading.bac-h1 .elementor-heading-title {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(38px, 5.2vw, 64px);
  line-height: 1.07;
  letter-spacing: -0.03em;
}

.elementor-widget-heading.bac-h2 .elementor-heading-title {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(30px, 3.3vw, 44px);
  line-height: 1.12;
  letter-spacing: -0.02em;
}

.elementor-widget-heading.bac-h3 .elementor-heading-title {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 20px;
  line-height: 1.32;
  letter-spacing: -0.01em;
}

.bac-h1 .elementor-heading-title span,
.bac-h2 .elementor-heading-title span {
  color: inherit;
}

/* Lead paragraph */
.elementor-widget-text-editor.bac-lead {
  font-size: 17px;
  line-height: 1.75;
  color: var(--muted);
}

.elementor-widget-text-editor.bac-lead .elementor-widget-container,
.elementor-widget-text-editor.bac-lead p {
  margin: 0;
  font: inherit;
  color: inherit;
}

.elementor-widget-text-editor.bac-lead p + p {
  margin-top: 1.1em;
}

.bac-on-dark .elementor-widget-text-editor.bac-lead {
  color: var(--muted);
}

/* Text inside sections that used to be dark */
.bac-on-dark p {
  color: var(--muted);
}

/* Rich text lists inside HTML / text widgets */
.bac-rich ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 14px;
}

.bac-rich ul li {
  position: relative;
  padding-left: 26px;
  font-size: 15.5px;
  color: var(--ink-700);
  line-height: 1.6;
}

.bac-rich ul li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 9px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--brand);
}

.bac-rich a {
  color: var(--brand-700);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ---------- Buttons ----------
   Selectors include .elementor-widget-button so they win over Elementor's
   own `.elementor-widget-button .elementor-button` rule (same specificity
   but loaded after the theme). */
.bac-btn.elementor-widget-button .elementor-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 17px 30px;
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.005em;
  text-align: center;
  transition: transform 0.25s var(--ease), background 0.25s var(--ease),
    color 0.25s var(--ease), border-color 0.25s var(--ease), box-shadow 0.25s var(--ease);
}

.bac-btn--primary.elementor-widget-button .elementor-button {
  background: var(--brand-600);
  color: #fff;
}

.bac-btn--primary.elementor-widget-button .elementor-button:hover {
  background: var(--brand-700);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: var(--shadow-brand);
}

.bac-btn--ghost.elementor-widget-button .elementor-button {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.34);
  color: #fff;
}

.bac-btn--ghost.elementor-widget-button .elementor-button:hover {
  background: #fff;
  border-color: #fff;
  color: var(--ink);
  transform: translateY(-2px);
}

.bac-btn--light.elementor-widget-button .elementor-button {
  background: #fff;
  color: var(--ink);
}

.bac-btn--light.elementor-widget-button .elementor-button:hover {
  background: #fff;
  color: var(--ink);
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.22);
}

.bac-btn--outline.elementor-widget-button .elementor-button {
  background: transparent;
  border-color: var(--ink);
  color: var(--ink);
}

.bac-btn--outline.elementor-widget-button .elementor-button:hover {
  background: var(--ink);
  color: #fff;
  transform: translateY(-2px);
}

.bac-btn--sm.elementor-widget-button .elementor-button {
  padding: 13px 22px;
  font-size: 14px;
}

/* Keep the two hero buttons left-aligned and next to each other. */
.bac-hero-actions > .elementor-container,
.bac-hero-actions > .e-con-inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  max-width: none !important;
  width: 100%;
  margin-left: 0 !important;
  margin-right: auto !important;
  gap: 14px !important;
}

.bac-hero-actions .elementor-column {
  width: auto !important;
  flex: 0 0 auto;
}

.bac-hero-actions .elementor-column > .elementor-widget-wrap.elementor-element-populated,
.bac-hero-actions .elementor-column > .elementor-element-populated,
.bac-hero-actions .elementor-column > .e-con-inner {
  padding: 0 !important;
}

.bac-hero-actions .elementor-widget-button {
  margin-bottom: 0;
}

@media (max-width: 680px) {
  .bac-hero-actions .elementor-column {
    width: 100% !important;
    flex-basis: 100%;
  }
}

/* ---------- Sections ---------- */
/*
 * Elementor 4 only ships CSS for its built-in column sizes (25/33/50/60/66…).
 * Custom sizes used by the imported templates need their own widths,
 * otherwise the columns collapse to their content width.
 */
@media (min-width: 768px) {
  .elementor-column.elementor-col-34 {
    width: 34%;
  }

  .elementor-column.elementor-col-42 {
    width: 42%;
  }

  .elementor-column.elementor-col-45 {
    width: 45%;
  }

  .elementor-column.elementor-col-55 {
    width: 55%;
  }

  .elementor-column.elementor-col-58 {
    width: 58%;
  }
}

.bac-hero:not(.bac-custom-bg) {
  position: relative;
  background: radial-gradient(900px 520px at 84% 16%, rgba(218, 99, 49, 0.18), transparent 62%),
    radial-gradient(720px 460px at 6% 94%, rgba(218, 99, 49, 0.1), transparent 60%),
    var(--brand-tint) !important;
  padding: 132px 0 0;
  overflow: hidden;
}

/* Light hero: white / orange palette, no dark photo overlay. */
.bac-hero .elementor-container,
.bac-hero > .e-con-inner {
  position: relative;
  z-index: 2;
}

/* Force readable dark text even when imported templates carry white colours. */
.bac-hero .elementor-widget-heading .elementor-heading-title,
.bac-hero h1,
.bac-hero h2,
.bac-hero h3 {
  color: var(--ink) !important;
}

.bac-hero .bac-accent {
  color: var(--brand-600) !important;
}

.bac-hero .elementor-widget-text-editor.bac-eyebrow {
  color: var(--brand-700) !important;
}

.bac-hero .elementor-widget-text-editor.bac-lead,
.bac-hero .elementor-widget-text-editor.bac-lead p {
  color: var(--muted) !important;
}

.bac-hero .elementor-counter-number,
.bac-hero .elementor-counter-number-suffix {
  color: var(--ink) !important;
}

.bac-hero .elementor-counter-title {
  color: var(--muted) !important;
}

.bac-hero .bac-btn--ghost.elementor-widget-button .elementor-button {
  border-color: rgba(46, 32, 25, 0.28) !important;
  color: var(--ink) !important;
}

.bac-hero .bac-btn--ghost.elementor-widget-button .elementor-button:hover {
  background: var(--brand-soft) !important;
  border-color: var(--brand) !important;
  color: var(--brand-700) !important;
}

/* Inner-page banner: same flat surface and rhythm as the News banner. */
.bac-hero--page.e-con-boxed {
  padding: 64px 0 56px !important;
  min-height: 300px;
  justify-content: center;
  background: var(--brand-tint) !important;
}

/* The column inside the banner repeats the same class, so it must not add
 * padding, height or a second gradient of its own. */
.bac-hero--page:not(.e-con-boxed) {
  padding: 0 !important;
  min-height: 0;
  background: none !important;
}

/* Home hero: tighter than the original 132px offset, and we now win over
   the 150px top padding the JSON ships with. */
.bac-hero.bac-bg-home.e-con-boxed {
  padding: 80px 0 20px !important;
}

@media (max-width: 680px) {
  .bac-hero.bac-bg-home.e-con-boxed {
    padding: 60px 0 14px !important;
  }

  .bac-hero--page.e-con-boxed {
    padding: 48px 0 40px !important;
    min-height: 240px;
  }
}

.bac-hero .bac-hero-stats {
  margin-top: 36px;
  padding-top: 20px;
  padding-bottom: 24px;
  border-top: 1px solid rgba(46, 32, 25, 0.14);
}

/* Core: !important 压掉 Elementor container 在 JSON 里自带的 top/bottom padding（100-150px）。
   两套叠起来就是用户看到的"空色块很大"。这里收口为唯一来源。 */
.bac-section {
  padding: 72px 0 !important;
}

.bac-section--tight {
  padding: 56px 0 !important;
}

/* Rhythm: every copy block and every action inside a section starts 20px
   lower, so headings, paragraphs and buttons share the same top spacing. */
.bac-section .elementor-widget-heading,
.bac-section .elementor-widget-text-editor,
.bac-section .elementor-widget-button,
.bac-cta .elementor-widget-heading,
.bac-cta .elementor-widget-text-editor,
.bac-cta .elementor-widget-button {
  padding-top: 20px;
}

.bac-section--mist {
  background: var(--mist);
}

.bac-section--ink {
  background: var(--brand-soft) !important;
  color: var(--ink) !important;
}

.bac-section--ink .elementor-widget-heading .elementor-heading-title {
  color: var(--ink);
}

/* Process cards (services).
   Their styles were written for the old dark band — white body copy on a 4%
   white card. The band is the light brand tint now, so the cards go white with
   dark text. */
.bac-section--ink .process__item {
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: var(--shadow-sm);
}

.bac-section--ink .process__item::before {
  color: var(--brand-700);
}

.bac-section--ink .process__item h3 {
  color: var(--ink);
}

.bac-section--ink .process__item p {
  color: var(--muted);
}

.bac-cta {
  position: relative;
  overflow: hidden;
  background: var(--brand-600);
  color: #fff;
  padding: 64px 0 !important;
}

.bac-cta h2,
.bac-cta .elementor-widget-heading .elementor-heading-title {
  color: #fff !important;
}

.bac-cta .elementor-widget-text-editor p,
.bac-cta .elementor-widget-text-editor.bac-lead,
.bac-cta .elementor-widget-text-editor.bac-lead p {
  color: rgba(255, 255, 255, 0.88) !important;
}

.bac-cta .elementor-widget-text-editor.bac-eyebrow {
  color: rgba(255, 255, 255, 0.8) !important;
}

.bac-cta .elementor-widget-text-editor .elementor-widget-container {
  color: rgba(255, 255, 255, 0.82);
}

/* The CTA action used to sit in a 34% column with align="right", so it floated
   at the far right edge and looked detached from the copy. Stack the band and
   start the button on the heading's left edge. */
.bac-cta > .e-con-inner,
.bac-cta > .elementor-container {
  flex-direction: column !important;
  align-items: flex-start !important;
  flex-wrap: nowrap !important;
}

.bac-cta > .e-con-inner > .elementor-column,
.bac-cta > .e-con-inner > .e-con,
.bac-cta > .elementor-container > .elementor-column {
  width: 100% !important;
  max-width: none !important;
}

.bac-cta .elementor-widget-button {
  text-align: left !important;
}

/* Older imports repeat `bac-cta` on the inner column; it must not paint a second
   orange band or its own padding. */
.bac-cta .bac-cta {
  background: transparent !important;
  padding: 0 !important;
}

/* Anchor navigation (services) */
.bac-anchornav {
  position: sticky;
  top: var(--header-h);
  z-index: 40;
  background: rgba(255, 255, 255, 0.97);
  backdrop-filter: blur(12px);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 18px 0;
}

body.admin-bar .bac-anchornav {
  top: calc(var(--header-h) + 32px);
}

.bac-anchornav a {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 500;
  color: var(--muted);
  transition: color 0.22s var(--ease);
}

.bac-anchornav a:hover {
  color: var(--brand-700);
}

.bac-anchornav .elementor-widget-container {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 30px;
}

/* ---------- Cards (icon box) ---------- */
.bac-card.elementor-widget-icon-box {
  height: 100%;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 34px 30px 30px;
  transition: transform 0.35s var(--ease), box-shadow 0.35s var(--ease),
    border-color 0.35s var(--ease);
}

.bac-card.elementor-widget-icon-box:hover {
  transform: translateY(-6px);
  border-color: rgba(218, 99, 49, 0.4);
  box-shadow: var(--shadow-md);
}

.elementor-widget-icon-box.bac-card .elementor-icon-box-icon {
  margin-bottom: 24px;
}

.elementor-widget-icon-box.bac-card .elementor-icon {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: var(--brand-soft);
  color: var(--brand);
  font-size: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.3s var(--ease), color 0.3s var(--ease);
}

.elementor-widget-icon-box.bac-card:hover .elementor-icon {
  background: var(--brand);
  color: #fff;
}

.elementor-widget-icon-box.bac-card .elementor-icon-box-title {
  margin-bottom: 10px;
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.01em;
}

.elementor-widget-icon-box.bac-card .elementor-icon-box-title a {
  color: inherit;
}

.elementor-widget-icon-box.bac-card .elementor-icon-box-description {
  color: var(--muted);
  font-size: 15px;
  line-height: 1.7;
}

.bac-card .bac-card-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 20px;
  font-family: var(--font-display);
  font-size: 13.5px;
  font-weight: 600;
  color: var(--brand-700);
}

/* Value card */
.bac-value.elementor-widget-icon-box {
  border-top: 2px solid var(--ink);
  padding: 26px 0 0;
  height: 100%;
}

.elementor-widget-icon-box.bac-value .elementor-icon {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: var(--brand-soft);
  color: var(--brand);
  font-size: 21px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
}

.elementor-widget-icon-box.bac-value .elementor-icon-box-title {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 8px;
}

.elementor-widget-icon-box.bac-value .elementor-icon-box-description {
  color: var(--muted);
  font-size: 14.5px;
  line-height: 1.65;
}

/* Contact info card */
.bac-info.elementor-widget-icon-box {
  background: var(--mist);
  border-radius: 16px;
  padding: 24px;
  transition: background 0.3s var(--ease);
}

.bac-info.elementor-widget-icon-box:hover {
  background: var(--brand-tint);
}

.elementor-widget-icon-box.bac-info .elementor-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: #fff;
  color: var(--brand);
  font-size: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--shadow-sm);
}

.elementor-widget-icon-box.bac-info .elementor-icon-box-title {
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 4px;
}

.elementor-widget-icon-box.bac-info .elementor-icon-box-description {
  font-size: 15.5px;
  font-weight: 500;
  color: var(--ink);
  line-height: 1.5;
}

/* ---------- Counters ---------- */
.elementor-widget-counter.bac-stat .elementor-counter-number-wrapper {
  font-family: var(--font-display);
  font-size: clamp(28px, 3vw, 40px);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1;
  color: var(--ink);
  justify-content: flex-start;
}

.elementor-widget-counter.bac-stat .elementor-counter-number-suffix {
  color: var(--brand);
}

.elementor-widget-counter.bac-stat .elementor-counter-title {
  margin-top: 10px;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
  text-align: left;
  line-height: 1.5;
  padding: 0;
}

/* ---------- Images ---------- */
.bac-photo,
.bac-photo .elementor-widget-container {
  overflow: hidden;
  border-radius: var(--radius-lg);
  background: var(--mist);
}

.bac-photo img {
  width: 100%;
  display: block;
  object-fit: cover;
  border-radius: inherit;
}

.bac-photo--portrait img {
  aspect-ratio: 4 / 4.4;
}

.bac-photo--wide img {
  aspect-ratio: 4 / 3;
}

/* ---------- Shortcode: news grid ---------- */
.news-grid--cols-2 {
  grid-template-columns: repeat(2, 1fr);
}

.news-grid--cols-3 {
  grid-template-columns: repeat(3, 1fr);
}

@media (max-width: 1080px) {
  .news-grid--cols-3 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 680px) {
  .news-grid--cols-2,
  .news-grid--cols-3 {
    grid-template-columns: 1fr;
  }
}

.bac-empty {
  padding: 40px;
  border: 1px dashed var(--line);
  border-radius: 14px;
  color: var(--muted);
  text-align: center;
}

/* ---------- Contact form shortcode ---------- */
.contact-card .form-success {
  margin-bottom: 22px;
}

.bac-form-error {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  background: #fdf2f0;
  border: 1px solid #f3d2ca;
  color: #8f3020;
  border-radius: 14px;
  padding: 16px 18px;
  font-size: 14px;
  margin-bottom: 22px;
}

.contact-card .form-note {
  margin-top: 12px;
}

/* ---------- Single post / archive ---------- */
.article-hero .page-banner {
  min-height: 440px;
}

.article-body .wp-block-image img,
.article-body img {
  border-radius: var(--radius);
}

.article-body a {
  color: var(--brand-700);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.pagination .page-numbers {
  min-width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 14px;
  color: var(--muted);
  padding: 0 12px;
  transition: all 0.22s var(--ease);
}

.pagination .page-numbers:hover {
  border-color: var(--ink);
  color: var(--ink);
}

.pagination .page-numbers.current {
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
}

/* ---------- Elementor editor tweaks ---------- */
.elementor-editor-active .bac-hero {
  padding-top: 90px;
  padding-bottom: 40px;
}

/* Keep the design readable without custom fonts */
.elementor-widget-text-editor p:last-child {
  margin-bottom: 0;
}

/* Elementor default container gutters on small screens */
@media (max-width: 680px) {
  .bac-hero {
    padding-top: 60px;
  }

  .bac-section {
    padding: 48px 0 !important;
  }

  .bac-cta {
    padding: 48px 0 !important;
  }
}

/* ---------- Extra element styles used by the imported templates ---------- */
.bac-accent {
  color: var(--brand-600);
}

.elementor-widget-text-editor.bac-eyebrow {
  margin-bottom: 12px;
}

.bac-h1,
.bac-h2,
.bac-h3 {
  margin-bottom: 18px;
}

.elementor-widget-text-editor.bac-lead {
  margin-bottom: 22px;
}

.bac-breadcrumb {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  letter-spacing: 0.04em;
  color: var(--muted-light);
  margin: 0 0 26px;
}

.bac-breadcrumb a {
  color: var(--muted-light);
  transition: color 0.2s var(--ease);
}

.bac-breadcrumb a:hover {
  color: var(--brand-700);
}

.bac-breadcrumb span {
  color: var(--line);
}

.elementor-widget-text-editor.bac-index {
  margin-bottom: 0;
}

.elementor-widget-text-editor.bac-index .elementor-widget-container {
  font-family: var(--font-display);
  font-size: 12px;
  letter-spacing: 0.14em;
  color: #8a837c;
}

.bac-anchor-links {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 30px;
}

.bac-anchor-links a {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 500;
  color: var(--muted);
  transition: color 0.22s var(--ease);
}

.bac-anchor-links a:hover {
  color: var(--brand-700);
}

.bac-service-row {
  border-top: 1px solid var(--line);
}

.bac-service-row .elementor-widget-text-editor {
  margin-bottom: 0;
}

.bac-service-row .service-list {
  margin-top: 6px;
}

.elementor-widget-icon-box.bac-value .elementor-icon-box-wrapper {
  height: 100%;
}

.elementor-widget-icon-box.bac-info {
  margin-bottom: 14px;
}

.bac-cta .elementor-widget-text-editor {
  margin-bottom: 24px;
}

.bac-cta .elementor-widget-button .elementor-button {
  white-space: nowrap;
}

.bac-hero-actions {
  margin-top: 36px;
}

.bac-hero-actions .elementor-widget-button {
  margin-bottom: 0;
}

/* Hero buttons: side by side under the lead paragraph. */
.bac-hero .elementor-widget-button {
  display: inline-block;
  margin-top: 34px;
  margin-bottom: 0;
}

.bac-hero .bac-hero-btn {
  margin-right: 14px;
}

/* Hero stats row: separate top-level section, four equal columns. */
.bac-hero-statsrow .bac-hero-stat.elementor-widget-counter {
  width: 100% !important;
  text-align: left;
}

/* Number first, label underneath. */
.bac-hero-statsrow .elementor-counter {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.bac-hero-statsrow .elementor-counter-number-wrapper {
  order: 1;
  flex-direction: row;
  align-items: baseline;
  gap: 2px;
}

.bac-hero-statsrow .elementor-counter-title {
  order: 2;
  margin-top: 10px;
}

.bac-hero-statsrow .elementor-widget-counter {
  margin-bottom: 0;
}

.bac-cta .elementor-widget-text-editor p {
  color: rgba(255, 255, 255, 0.85);
  font-size: 16px;
  line-height: 1.7;
}

.bac-hero .elementor-widget-heading.bac-h1 {
  max-width: 800px;
}

.bac-hero .elementor-widget-text-editor.bac-lead .elementor-widget-container {
  max-width: 620px;
}

.elementor-widget-icon-box.bac-card .elementor-widget-container,
.elementor-widget-icon-box.bac-card .elementor-icon-box-wrapper {
  height: 100%;
}

.bac-photo .elementor-widget-container a {
  display: block;
}

.bac-photo img {
  border-radius: inherit;
}

@media (max-width: 920px) {
  .bac-hero-actions {
    margin-top: 26px;
  }

  .bac-service-row {
    padding-top: 44px;
    padding-bottom: 44px;
  }
}

@media (max-width: 680px) {
  .bac-anchor-links {
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 10px 20px;
    padding-bottom: 4px;
  }

  .bac-breadcrumb {
    flex-wrap: wrap;
  }
}

/* ---------- Platform cards (logo + name + note) ---------- */
.bac-platforms .elementor-container,
.bac-platforms > .e-con-inner {
  flex-wrap: wrap;
}

.bac-platforms .elementor-column {
  padding: 8px;
}

.bac-platforms .elementor-column > .elementor-widget-wrap,
.bac-platforms .elementor-column > .e-con-inner {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  text-align: center;
  padding: 28px 18px !important;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  transition: transform 0.3s var(--ease), border-color 0.3s var(--ease),
    background 0.3s var(--ease), box-shadow 0.3s var(--ease);
}

.bac-platforms .elementor-column:hover > .elementor-widget-wrap,
.bac-platforms .elementor-column:hover > .e-con-inner {
  transform: translateY(-3px);
  border-color: rgba(218, 99, 49, 0.45);
  background: var(--brand-tint);
  box-shadow: var(--shadow-sm);
}

.bac-platforms .bac-platform-logo {
  width: 100%;
  margin-bottom: 14px;
}

.bac-platforms .bac-platform-logo img {
  display: block;
  width: 100%;
  height: 96px;
  object-fit: contain;
  margin: 0 auto;
}

.bac-platforms .bac-platform-name .elementor-heading-title {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
  color: var(--ink);
}

.bac-platforms .bac-platform-note p {
  margin: 6px 0 0;
  font-size: 11.5px;
  line-height: 1.5;
  letter-spacing: 0.04em;
  text-align: center;
  color: var(--muted);
}

@media (max-width: 1080px) {
  .bac-platforms .elementor-column.elementor-col-20 {
    width: 33.333% !important;
  }
}

@media (max-width: 680px) {
  .bac-platforms .elementor-column.elementor-col-20 {
    width: 50% !important;
  }
}

/* ---------- Brands we have served ---------- */
.bac-brands .elementor-container,
.bac-brands > .e-con-inner {
  flex-wrap: wrap;
}

.bac-brands .elementor-column > .elementor-widget-wrap,
.bac-brands .elementor-column > .e-con-inner {
  height: 100%;
  min-height: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px !important;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  transition: transform 0.3s var(--ease), box-shadow 0.3s var(--ease),
    border-color 0.3s var(--ease);
}

.bac-brands .elementor-column:hover > .elementor-widget-wrap,
.bac-brands .elementor-column:hover > .e-con-inner {
  transform: translateY(-4px);
  border-color: rgba(218, 99, 49, 0.35);
  box-shadow: var(--shadow-md);
}

.bac-brands .bac-brand-logo {
  width: 100%;
}

/* Logos arrive at very different pixel sizes; a fixed box plus contain makes
   every card read the same weight without cropping or stretching. */
.bac-brands .bac-brand-logo img {
  display: block;
  width: 100%;
  height: 84px;
  object-fit: contain;
  margin: 0 auto;
  filter: grayscale(1);
  opacity: 0.7;
  transition: filter 0.3s var(--ease), opacity 0.3s var(--ease);
}

.bac-brands .elementor-column:hover .bac-brand-logo img {
  filter: none;
  opacity: 1;
}

/* Our clients — exact card count per row.
   A duplicated Elementor column keeps its original `elementor-col-33` class, so
   percentage widths push the fourth card onto a second line. A grid on the row
   replaces those widths, whatever sizes are stored in the JSON. */
.bac-brands > .e-con-inner,
.bac-brands > .elementor-container {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}

.bac-brands > .e-con-inner > .elementor-column,
.bac-brands > .e-con-inner > .e-con,
.bac-brands > .elementor-container > .elementor-column,
.bac-brands > .elementor-container > .e-con {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  flex: 0 0 auto !important;
  padding: 0 !important;
}

@media (max-width: 1080px) {
  .bac-brands > .e-con-inner,
  .bac-brands > .elementor-container {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 860px) {
  .bac-brands > .e-con-inner,
  .bac-brands > .elementor-container {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .bac-brands > .e-con-inner,
  .bac-brands > .elementor-container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
}

/* Several brand rows are separate containers; without this the second row
   starts flush against the first one. */
.bac-brands + .bac-brands {
  padding-top: 16px !important;
}

/* Fallback for templates imported before column sizes were normalised. */
.elementor-column[class~="elementor-col-33.33"] {
  width: 33.333%;
}

/* ==========================================================================
   Flat rows
   Elementor 4 discards nested sections when an image is replaced and the
   page is published, which made whole blocks disappear. Every card row is
   therefore a top-level section. These rules keep the original rhythm:
   the heading section drops its bottom padding and the last row carries it.
   ========================================================================== */
.bac-section--mid {
  padding-bottom: 0 !important;
}

.bac-row {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.bac-row--head {
  padding-top: 24px !important;
}

.bac-row--tail {
  padding-bottom: 56px !important;
}

@media (max-width: 680px) {
  .bac-row--head {
    padding-top: 18px !important;
  }

  .bac-row--tail {
    padding-bottom: 40px !important;
  }
}

/* --------------------------------------------------------------------------
   Flat hero: the two buttons sit side by side in the hero column, and the
   counters live in their own top-level section right below it. That section
   repeats the hero background so both blocks read as one.
   -------------------------------------------------------------------------- */
.bac-hero .elementor-widget-wrap > .elementor-widget-button {
  width: auto !important;
}

.bac-hero .elementor-widget-wrap > .elementor-widget-button + .elementor-widget-button {
  margin-left: 14px;
}

.bac-hero {
  padding-bottom: 40px !important;
}

.bac-hero-statsrow {
  background: var(--brand-tint) !important;
  padding: 0 0 28px !important;
}

.bac-hero-statsrow .elementor-column > .elementor-widget-wrap {
  padding-top: 30px;
  border-top: 1px solid rgba(46, 32, 25, 0.14);
}

@media (max-width: 680px) {
  .bac-hero {
    padding-bottom: 28px !important;
  }

  .bac-hero-statsrow .elementor-column {
    width: 50% !important;
    margin-bottom: 18px;
  }
}

/* --------------------------------------------------------------------------
   Empty image widgets
   Templates ship without artwork so every image can be picked from the Media
   Library. These rules keep the box in place until one is selected.
   -------------------------------------------------------------------------- */
.bac-photo .elementor-widget-container {
  min-height: 320px;
  background: var(--mist);
  border-radius: var(--radius-lg);
}

.bac-photo--portrait .elementor-widget-container {
  min-height: 430px;
}

.bac-photo--wide .elementor-widget-container {
  min-height: 300px;
}

/* About page: show the photographs whole instead of cropping them to the
   4:4.4 / 4:3 frames used on the home page. The height follows the file, so
   nothing is cut off. */
.bac-page-about .bac-photo .elementor-widget-container {
  min-height: 0;
}

.bac-page-about .bac-photo img {
  aspect-ratio: auto !important;
  height: auto !important;
  object-fit: contain;
}

.bac-platforms .bac-platform-logo {
  min-height: 96px;
}

.bac-brands .bac-brand-logo {
  min-height: 84px;
}