/* BuildLab static-site additions: redesigned mobile menu + form states. Desktop layout untouched. */
:root { --bl-orange: #FF8142; --bl-ink: #01050C; --bl-panel: #0B0B0C; --bl-line: rgba(255,255,255,.08); --bl-muted: #C4BAB5; }

/* Hide Elementor's stock mobile dropdown; .bl-menu replaces it */
@media (max-width: 1024px) {
  .elementor-nav-menu--dropdown.elementor-nav-menu__container { display: none !important; }
}
.bl-menu { position: fixed; inset: 0; z-index: 99999; background: var(--bl-panel); color: #fff;
  display: flex; flex-direction: column; opacity: 0; visibility: hidden; transform: translateY(-12px);
  transition: opacity .28s ease, transform .28s ease, visibility 0s linear .28s; font-family: "Inter", sans-serif; }
.bl-menu.is-open { opacity: 1; visibility: visible; transform: none; transition: opacity .28s ease, transform .28s ease; }
.bl-menu__top { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px; border-bottom: 1px solid var(--bl-line); }
.bl-menu__logo img { height: 30px; width: auto; display: block; }
.bl-menu__close { width: 44px; height: 44px; border: 1px solid var(--bl-line); background: transparent; color: #fff; border-radius: 50%;
  display: grid; place-items: center; cursor: pointer; }
.bl-menu__close svg { width: 18px; height: 18px; }
.bl-menu__nav { flex: 1; overflow-y: auto; padding: 8px 20px 24px; -webkit-overflow-scrolling: touch; }
.bl-menu__nav ul { list-style: none; margin: 0; padding: 0; }
.bl-menu__item { border-bottom: 1px solid var(--bl-line); opacity: 0; transform: translateY(8px); transition: opacity .35s ease, transform .35s ease; }
.bl-menu.is-open .bl-menu__item { opacity: 1; transform: none; }
.bl-menu__row { display: flex; align-items: center; }
.bl-menu__link { flex: 1; display: block; padding: 20px 0; color: #fff !important; text-decoration: none;
  font-family: "Clash Display", "Inter", sans-serif; font-size: 26px; font-weight: 500; letter-spacing: -.01em; line-height: 1.1; }
.bl-menu__link[aria-current="page"] { color: var(--bl-orange) !important; }
.bl-menu__toggle { width: 48px; height: 48px; border: 1px solid var(--bl-line); border-radius: 50%; background: transparent; color: #fff;
  display: grid; place-items: center; cursor: pointer; transition: background .2s, border-color .2s; }
.bl-menu__toggle svg { width: 14px; height: 14px; transition: transform .3s ease; }
.bl-menu__toggle[aria-expanded="true"] { background: var(--bl-orange); border-color: var(--bl-orange); }
.bl-menu__toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.bl-menu__sub { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .3s ease; }
.bl-menu__sub.is-open { grid-template-rows: 1fr; }
.bl-menu__sub > ul { overflow: hidden; }
.bl-menu__sub li:last-child { padding-bottom: 16px; }
.bl-menu__sub a { display: flex; align-items: center; gap: 12px; padding: 12px 0 12px 4px; color: var(--bl-muted) !important; text-decoration: none; font-size: 17px; }
.bl-menu__sub a::before { content: ""; width: 18px; height: 1px; background: var(--bl-orange); flex: none; }
.bl-menu__sub a:active, .bl-menu__sub a[aria-current="page"] { color: #fff !important; }
.bl-menu__foot { padding: 16px 20px calc(16px + env(safe-area-inset-bottom)); display: grid; gap: 10px; border-top: 1px solid var(--bl-line); }
.bl-menu__cta { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 54px; text-decoration: none;
  font-family: "Clash Display", "Inter", sans-serif; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; font-size: 15px; }
.bl-menu__cta--primary { background: var(--bl-orange); color: #fff !important; }
.bl-menu__cta--ghost { border: 1px solid var(--bl-orange); color: var(--bl-orange) !important; }
.bl-menu__cta svg { width: 16px; height: 16px; fill: currentColor; }
html.bl-menu-lock, html.bl-menu-lock body { overflow: hidden !important; }
@media (min-width: 1025px) { .bl-menu { display: none; } }
@media (prefers-reduced-motion: reduce) { .bl-menu, .bl-menu__item, .bl-menu__sub, .bl-menu__toggle svg { transition: none !important; } }

/* Form states */
.bl-form-msg { margin-top: 14px; padding: 14px 16px; font-size: 15px; line-height: 1.4; border-left: 3px solid var(--bl-orange); background: rgba(255,129,66,.08); }
.bl-form-msg--error { border-color: #e5484d; background: rgba(229,72,77,.08); }
.bl-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* ---------- Project cards: legible titles ---------- */
.e-loop-item > .e-con { position: relative; overflow: hidden; isolation: isolate; }
.e-loop-item > .e-con::after {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: linear-gradient(to top, rgba(1,5,12,.9) 0%, rgba(1,5,12,.62) 32%, rgba(1,5,12,.22) 62%, rgba(1,5,12,.08) 100%);
  transition: opacity .45s ease;
}
.e-loop-item > .e-con > :not(.elementor-absolute) { position: relative; z-index: 1; }
.e-loop-item .elementor-heading-title a { text-shadow: 0 2px 18px rgba(0,0,0,.45); }
.e-loop-item > .e-con:hover::after { opacity: .82; }
.e-loop-item .elementor-button { transition: color .2s ease, letter-spacing .3s ease; }
.e-loop-item > .e-con:hover .elementor-button { letter-spacing: .12em; }

/* Card animation is ours (staggered reveal / stacking), not Elementor's all-at-once fade */
.elementor-widget-loop-grid.elementor-invisible, .e-loop-item > .e-con.elementor-invisible { visibility: visible !important; }
.elementor-widget-loop-grid.animated, .e-loop-item > .e-con.animated { animation: none !important; }
.bl-reveal { opacity: 0; translate: 0 56px; }
.bl-reveal.is-in { opacity: 1; translate: 0 0; transition: opacity .8s ease var(--bl-delay, 0ms), translate 1s cubic-bezier(.16,.84,.24,1) var(--bl-delay, 0ms); }

/* Projects page: cards slide up and stack over each other as you scroll */
.bl-stack { --bl-stack-top: 40px; }
.bl-stack > .e-loop-item {
  position: sticky; top: calc(var(--bl-stack-top) + var(--bl-i, 0) * 14px);
  transform-origin: 50% 0; will-change: transform;
  transform: scale(calc(1 - var(--bl-cover, 0) * .06));
  filter: brightness(calc(1 - var(--bl-cover, 0) * .5));
  box-shadow: 0 -24px 60px rgba(0,0,0,.45);
}
.bl-stack > .e-loop-item.is-filtered-out { display: none; }
@media (max-width: 1024px) { .bl-stack { --bl-stack-top: 32px; } }
@media (max-width: 767px) { .bl-stack { --bl-stack-top: 20px; } .bl-stack > .e-loop-item { top: calc(var(--bl-stack-top) + var(--bl-i, 0) * 10px); } }

/* ---------- Projects status filter ---------- */
.bl-filter { display: flex; justify-content: center; margin: 0 auto 8px; font-family: "Clash Display", "Inter", sans-serif; }
.bl-filter__tabs { position: relative; display: inline-flex; gap: 4px; padding: 5px; border: 1px solid var(--bl-line); border-radius: 999px; background: rgba(255,255,255,.02); }
.bl-filter__tab { position: relative; z-index: 1; border: 0; background: transparent; color: var(--bl-muted); cursor: pointer;
  padding: 11px 20px; border-radius: 999px; font: 500 14px/1 "Clash Display", "Inter", sans-serif; letter-spacing: .06em; text-transform: uppercase; transition: color .25s; white-space: nowrap; }
.bl-filter__tab:hover { color: #fff; }
.bl-filter__tab[aria-pressed="true"] { color: #fff; }
.bl-filter__tab small { font-size: 11px; opacity: .6; margin-left: 6px; font-family: "Inter", sans-serif; }
.bl-filter__pill { position: absolute; z-index: 0; top: 5px; bottom: 5px; border-radius: 999px; background: var(--bl-orange); transition: left .35s cubic-bezier(.3,.8,.3,1), width .35s cubic-bezier(.3,.8,.3,1); }
.bl-filter__select { display: none; position: relative; width: 100%; max-width: 420px; }
.bl-filter__button { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px;
  background: #0B0B0C; color: #fff; border: 1px solid var(--bl-line); font: 500 15px/1 "Clash Display", "Inter", sans-serif; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; }
.bl-filter__button span { color: var(--bl-muted); font-size: 12px; }
.bl-filter__button svg { width: 14px; height: 14px; transition: transform .3s; flex: none; }
.bl-filter__select.is-open .bl-filter__button { border-color: var(--bl-orange); }
.bl-filter__select.is-open .bl-filter__button svg { transform: rotate(180deg); }
.bl-filter__menu { position: absolute; z-index: 20; left: 0; right: 0; top: calc(100% + 6px); margin: 0; padding: 6px; list-style: none; background: #0B0B0C; border: 1px solid var(--bl-line);
  box-shadow: 0 20px 50px rgba(0,0,0,.5); opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity .22s ease, transform .22s ease, visibility 0s linear .22s; }
.bl-filter__select.is-open .bl-filter__menu { opacity: 1; visibility: visible; transform: none; transition: opacity .22s ease, transform .22s ease; }
.bl-filter__menu button { width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 14px; border: 0; background: transparent; color: #fff; text-align: left; cursor: pointer; font: 400 16px/1.2 "Inter", sans-serif; }
.bl-filter__menu button span { color: var(--bl-muted); font-size: 13px; }
.bl-filter__menu button[aria-selected="true"] { color: var(--bl-orange); }
.bl-filter__menu button:hover, .bl-filter__menu button:focus-visible { background: rgba(255,255,255,.04); outline: none; }
@media (max-width: 767px) { .bl-filter__tabs { display: none; } .bl-filter__select { display: block; } }
.e-loop-item.is-filtering-in { animation: blCardIn .5s cubic-bezier(.16,.84,.24,1) both; }
@keyframes blCardIn { from { opacity: 0; translate: 0 30px; } to { opacity: 1; translate: 0 0; } }

/* ---------- Header dropdown (desktop Services menu) ---------- */
.elementor-nav-menu--main .sub-menu {
  background: #0B0B0C !important; border: 1px solid var(--bl-line) !important; border-top: 2px solid var(--bl-orange) !important;
  padding: 8px 0 !important; min-width: 250px !important; box-shadow: 0 24px 60px rgba(0,0,0,.55);
  animation: blDrop .26s cubic-bezier(.2,.8,.2,1);
}
.elementor-nav-menu--main .sub-menu a.elementor-sub-item { position: relative; padding: 14px 22px !important; color: #fff !important; background: transparent !important;
  font-size: 14px !important; letter-spacing: .05em; transition: color .2s ease, padding-left .25s ease; }
.elementor-nav-menu--main .sub-menu a.elementor-sub-item::before { content: ""; position: absolute; left: 22px; top: 50%; width: 0; height: 1px; background: var(--bl-orange); transition: width .25s ease; }
.elementor-nav-menu--main .sub-menu a.elementor-sub-item:hover, .elementor-nav-menu--main .sub-menu a.elementor-sub-item:focus-visible { color: var(--bl-orange) !important; padding-left: 44px !important; }
.elementor-nav-menu--main .sub-menu a.elementor-sub-item:hover::before, .elementor-nav-menu--main .sub-menu a.elementor-sub-item:focus-visible::before { width: 14px; }
.elementor-nav-menu--main .sub-menu li + li { border-top: 1px solid var(--bl-line); }
.elementor-nav-menu--main .menu-item-has-children > a .sub-arrow svg { transition: transform .25s ease; }
.elementor-nav-menu--main .menu-item-has-children:hover > a .sub-arrow svg, .elementor-nav-menu--main .menu-item-has-children > a.highlighted .sub-arrow svg { transform: rotate(180deg); }
.elementor-nav-menu--main .sub-menu li { animation: blDropItem .3s ease both; }
.elementor-nav-menu--main .sub-menu li:nth-child(2) { animation-delay: .04s; }
.elementor-nav-menu--main .sub-menu li:nth-child(3) { animation-delay: .08s; }
.elementor-nav-menu--main .sub-menu li:nth-child(4) { animation-delay: .12s; }
@keyframes blDrop { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes blDropItem { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  .bl-reveal { opacity: 1; translate: none; }
  .bl-stack > .e-loop-item { position: static; transform: none; filter: none; }
  .elementor-nav-menu--main .sub-menu, .elementor-nav-menu--main .sub-menu li, .e-loop-item.is-filtering-in { animation: none; }
}

/* Keep the header (and its dropdown) above animated page content */
.elementor-location-header { position: relative; z-index: 9990; }

/* ---------- Nav bar: readable over any photo, solid once scrolled ---------- */
.elementor-location-header .cust_header { transition: background-color .35s ease, backdrop-filter .35s ease, box-shadow .35s ease; }
.single-project .elementor-location-header .cust_header { background: linear-gradient(to bottom, rgba(1,5,12,.78), rgba(1,5,12,.35)) !important; }
html.bl-scrolled .elementor-location-header .cust_header { background: rgba(1,5,12,.86) !important; -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: 0 1px 0 rgba(255,255,255,.06); }

/* ---------- Project page hero ---------- */
.single-project .elementor-element-7ad061a { position: relative; overflow: hidden; isolation: isolate; }
.single-project .elementor-element-7ad061a::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(to bottom, rgba(1,5,12,.78) 0%, rgba(1,5,12,.2) 26%, rgba(1,5,12,.2) 48%, rgba(1,5,12,.88) 88%, #01050C 100%);
}
.single-project .elementor-element-7ad061a > :not(.bl-hero-bg) { position: relative; z-index: 2; }
.bl-hero-bg { position: absolute; inset: 0; z-index: 0; background-size: cover; background-position: center; transform-origin: 50% 60%;
  animation: blKenBurns 9s cubic-bezier(.2,.6,.2,1) both; will-change: transform; }
.bl-hero-bg.is-set ~ * { }
@keyframes blKenBurns { from { transform: scale(1.14); } to { transform: scale(1.02); } }
.single-project .elementor-element-806915b .elementor-heading-title { color: #fff !important; text-shadow: 0 4px 30px rgba(0,0,0,.45); }
.single-project .elementor-element-c9b9aa0 .elementor-image-box-title, .single-project .elementor-element-ab70126 .elementor-image-box-title { color: var(--bl-orange) !important; }
.single-project .elementor-element-c9b9aa0 .elementor-image-box-description, .single-project .elementor-element-ab70126 .elementor-image-box-description { color: #fff !important; }
/* Title mask reveal + meta stagger (replaces Elementor's plain fade) */
.bl-anim-ready .elementor-element-806915b .elementor-heading-title { clip-path: inset(0 0 100% 0); translate: 0 40px; }
.bl-anim-go .elementor-element-806915b .elementor-heading-title { clip-path: inset(0 0 -10% 0); translate: 0 0; transition: clip-path 1.1s cubic-bezier(.2,.8,.2,1) .15s, translate 1.1s cubic-bezier(.2,.8,.2,1) .15s; }
.bl-anim-ready .elementor-element-c9b9aa0, .bl-anim-ready .elementor-element-ab70126 { opacity: 0; translate: 0 20px; }
.bl-anim-go .elementor-element-c9b9aa0, .bl-anim-go .elementor-element-ab70126 { opacity: 1; translate: 0 0; transition: opacity .8s ease .55s, translate .8s ease .55s; }
.bl-anim-go .elementor-element-ab70126 { transition-delay: .7s; }
.single-project .elementor-element-806915b.elementor-invisible, .single-project .elementor-element-c9b9aa0.elementor-invisible, .single-project .elementor-element-ab70126.elementor-invisible { visibility: visible !important; }
.single-project .elementor-element-806915b.animated, .single-project .elementor-element-c9b9aa0.animated, .single-project .elementor-element-ab70126.animated { animation: none !important; }

/* ---------- Project story timeline ---------- */
.bl-entry .bl-entry__photo { clip-path: inset(0 100% 0 0); transition: clip-path 1.1s cubic-bezier(.7,0,.2,1); }
.bl-entry .bl-entry__text { opacity: 0; translate: 0 36px; transition: opacity .9s ease .35s, translate .9s cubic-bezier(.16,.84,.24,1) .35s; }
.bl-entry.is-in .bl-entry__photo { clip-path: inset(0 0 0 0); }
.bl-entry.is-in .bl-entry__text { opacity: 1; translate: 0 0; }
.bl-entry .elementor-element.elementor-invisible { visibility: visible !important; }
.bl-entry .elementor-element.animated { animation: none !important; }
.bl-entry.is-in .bl-entry__dot img { animation: blDot 1.6s ease .5s 2; }
@keyframes blDot { 0%, 100% { transform: scale(1); filter: none; } 40% { transform: scale(1.7); filter: drop-shadow(0 0 8px rgba(255,129,66,.9)); } }
.bl-timeline-line { position: absolute; left: 0; top: 0; width: 1px; background: var(--bl-orange); transform-origin: 0 0; transform: scaleY(var(--bl-line, 0)); pointer-events: none; z-index: 3; box-shadow: 0 0 10px rgba(255,129,66,.6); }

/* ---------- Gallery ---------- */
.single-project .e-gallery-item { overflow: hidden; }
.single-project .e-gallery-image { transition: transform .9s cubic-bezier(.2,.8,.2,1), filter .5s ease !important; }
.single-project .e-gallery-item:hover .e-gallery-image { transform: scale(1.06); }
.bl-gal { opacity: 0; translate: 0 40px; scale: .97; }
.bl-gal.is-in { opacity: 1; translate: 0 0; scale: 1; transition: opacity .8s ease var(--bl-delay, 0ms), translate .9s cubic-bezier(.16,.84,.24,1) var(--bl-delay, 0ms), scale .9s cubic-bezier(.16,.84,.24,1) var(--bl-delay, 0ms); }

/* ---------- Forms (Fluent + Elementor), site-wide ---------- */
.elementor-widget-form .elementor-form, .fluentform-widget-wrapper .frm-fluent-form {
  background: linear-gradient(160deg, #0F0F11, #08090B); border: 1px solid rgba(255,255,255,.09); padding: 32px; position: relative;
}
.elementor-widget-form .elementor-form::before, .fluentform-widget-wrapper .frm-fluent-form::before {
  content: ""; position: absolute; left: 0; top: 0; width: 64px; height: 2px; background: var(--bl-orange);
}
.elementor-widget-form .elementor-field-label, .fluentform-widget-wrapper .ff-el-input--label label {
  font-family: "Clash Display", "Inter", sans-serif !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: .12em !important;
  text-transform: uppercase !important; color: var(--bl-muted) !important; margin-bottom: 8px !important;
}
.elementor-widget-form .elementor-field-group { margin-bottom: 18px !important; }
.fluentform-widget-wrapper .ff-el-group { margin-bottom: 18px !important; }
.elementor-widget-form .elementor-field-group .elementor-field.elementor-field-textual,
.fluentform-widget-wrapper .ff-el-form-control {
  background: rgba(255,255,255,.03) !important; border: 1px solid rgba(255,255,255,.16) !important; border-radius: 0 !important;
  color: #fff !important; font-family: "Inter", sans-serif !important; font-size: 16px !important; padding: 15px 16px !important; min-height: 54px;
  transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease !important; box-shadow: none !important;
}
.elementor-widget-form textarea.elementor-field, .fluentform-widget-wrapper textarea.ff-el-form-control { min-height: 130px; resize: vertical; }
.elementor-widget-form .elementor-field::placeholder, .fluentform-widget-wrapper .ff-el-form-control::placeholder { color: rgba(255,255,255,.32) !important; }
.elementor-widget-form .elementor-field-group .elementor-field.elementor-field-textual:hover, .fluentform-widget-wrapper .ff-el-form-control:hover { border-color: rgba(255,255,255,.32) !important; }
.elementor-widget-form .elementor-field-group .elementor-field.elementor-field-textual:focus, .fluentform-widget-wrapper .ff-el-form-control:focus {
  outline: none !important; border-color: var(--bl-orange) !important; background: rgba(255,129,66,.05) !important; box-shadow: 0 0 0 3px rgba(255,129,66,.18) !important;
}
.elementor-widget-form .elementor-field-group.is-invalid .elementor-field, .fluentform-widget-wrapper .ff-el-group.is-invalid .ff-el-form-control { border-color: #e5484d !important; }
.elementor-widget-form .e-form__buttons .elementor-button, .fluentform-widget-wrapper .ff-btn-submit {
  position: relative; overflow: hidden; width: 100%; min-height: 58px; border: 0 !important; border-radius: 0 !important; background: var(--bl-orange) !important; color: #fff !important;
  font-family: "Clash Display", "Inter", sans-serif !important; font-size: 15px !important; font-weight: 600 !important; letter-spacing: .1em !important; text-transform: uppercase;
  transition: box-shadow .25s ease, transform .25s ease !important; cursor: pointer;
}
.elementor-widget-form .e-form__buttons .elementor-button::after, .fluentform-widget-wrapper .ff-btn-submit::after {
  content: "→"; display: inline-block; margin-left: 10px; transition: transform .25s ease;
}
.elementor-widget-form .e-form__buttons .elementor-button:hover, .fluentform-widget-wrapper .ff-btn-submit:hover { box-shadow: 0 12px 32px rgba(255,129,66,.35); transform: translateY(-1px); }
.elementor-widget-form .e-form__buttons .elementor-button:hover::after, .fluentform-widget-wrapper .ff-btn-submit:hover::after { transform: translateX(5px); }
.elementor-widget-form .e-form__buttons .elementor-button[disabled], .fluentform-widget-wrapper .ff-btn-submit[disabled] { opacity: .7; cursor: progress; }
.elementor-field-type-recaptcha_v3 { display: none !important; }
.bl-form-note { margin: 14px 0 0; font-size: 13px; color: rgba(255,255,255,.45); text-align: center; }
@media (max-width: 767px) {
  .elementor-widget-form .elementor-form, .fluentform-widget-wrapper .frm-fluent-form { padding: 22px 18px; box-sizing: border-box; max-width: 100%; }
  .elementor-widget-form .e-form__buttons .elementor-button, .fluentform-widget-wrapper .ff-btn-submit {
    font-size: 13px !important; letter-spacing: .06em !important; white-space: normal !important; line-height: 1.3 !important; padding: 14px 16px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .bl-hero-bg { animation: none; transform: none; }
  .bl-anim-ready .elementor-element-806915b .elementor-heading-title, .bl-anim-ready .elementor-element-c9b9aa0, .bl-anim-ready .elementor-element-ab70126 { clip-path: none; opacity: 1; translate: none; }
  .bl-entry .bl-entry__photo { clip-path: none; } .bl-entry .bl-entry__text { opacity: 1; translate: none; }
  .bl-gal { opacity: 1; translate: none; scale: none; }
  .bl-timeline-line { display: none; }
}

/* ---------- "Why choose BuildLab" pinned section ---------- */
.bl-why .left-content .elementor-element.elementor-invisible { visibility: visible !important; }
.bl-why .left-content .elementor-element.animated { animation: none !important; }
.bl-why .left-content, .bl-why .left-container { overflow: visible !important; }
.bl-why__count { position: absolute; right: 0; bottom: 28px; display: flex; align-items: center; gap: 14px; z-index: 5;
  font-family: "Clash Display", "Inter", sans-serif; color: var(--bl-muted); font-size: 14px; letter-spacing: .08em; }
.bl-why__count b { color: #fff; font-weight: 500; font-size: 20px; min-width: 26px; }
.bl-why__count span { position: relative; width: 120px; height: 1px; background: rgba(255,255,255,.18); overflow: hidden; }
.bl-why__count span::after { content: ""; position: absolute; inset: 0; background: var(--bl-orange); transform-origin: 0 0; transform: scaleX(var(--p, 0)); }

/* ---------- Neutralise the old theme's pink/purple button + link states ---------- */
.bl-menu button, .bl-menu button:hover, .bl-menu button:focus,
.bl-filter button, .bl-filter button:hover, .bl-filter button:focus { background-color: transparent; color: inherit; border-radius: inherit; }
.bl-menu .bl-menu__close:hover, .bl-menu .bl-menu__close:focus { background: rgba(255,255,255,.06); color: #fff; }
.bl-menu .bl-menu__toggle[aria-expanded="true"], .bl-menu .bl-menu__toggle[aria-expanded="true"]:hover, .bl-menu .bl-menu__toggle[aria-expanded="true"]:focus { background: var(--bl-orange); color: #fff; border-color: var(--bl-orange); }
.bl-menu .bl-menu__toggle { border-radius: 50%; padding: 0; }
.bl-filter .bl-filter__tab { border-radius: 999px; padding: 11px 20px; border: 0; }
.bl-filter .bl-filter__tab[aria-pressed="true"], .bl-filter .bl-filter__tab:hover { color: #fff; }
.bl-filter .bl-filter__button, .bl-filter .bl-filter__button:hover, .bl-filter .bl-filter__button:focus { background: #0B0B0C; color: #fff; border: 1px solid var(--bl-line); border-radius: 0; padding: 16px 20px; }
.bl-filter .bl-filter__menu button { border: 0; border-radius: 0; padding: 14px; }
.bl-filter .bl-filter__menu button:hover, .bl-filter .bl-filter__menu button:focus-visible { background: rgba(255,255,255,.04); }
.bl-menu button:focus-visible, .bl-filter button:focus-visible { outline: 2px solid var(--bl-orange); outline-offset: 2px; }
.elementor-location-header a:hover, .elementor-location-header a:active, .elementor-location-header a:focus { text-decoration: none; }
.elementor-nav-menu--main .elementor-item:active, .elementor-nav-menu--main .elementor-item:focus { color: inherit; }
.elementor-menu-toggle, .elementor-menu-toggle:hover, .elementor-menu-toggle:focus { background-color: transparent !important; }
/* Mobile menu: the Services label opens its list too */
.bl-menu__row .bl-menu__link[data-toggle] { cursor: pointer; }
.bl-menu__sub .bl-menu__all a { color: #fff !important; font-weight: 500; }

/* Desktop dropdown: CSS fallback so it always opens on hover / keyboard focus */
@media (min-width: 1025px) {
  .elementor-nav-menu--main .menu-item-has-children:hover > .sub-menu,
  .elementor-nav-menu--main .menu-item-has-children:focus-within > .sub-menu { display: block !important; left: 0; top: 100%; }
}

/* ---------- Service cards: swipe slider on phones ---------- */
.bl-swipe__dots { display: none; }
@media (max-width: 767px) {
  .elementor-loop-container.bl-swipe { display: flex !important; gap: 14px !important; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 16px;
    padding: 4px 16px 8px; margin: 0 -16px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .elementor-loop-container.bl-swipe::-webkit-scrollbar { display: none; }
  .elementor-loop-container.bl-swipe > .e-loop-item { flex: 0 0 84%; scroll-snap-align: start; }
  .elementor-loop-container.bl-swipe > .e-loop-item > .e-con { height: 100%; }
  .bl-swipe__dots { display: flex; justify-content: center; gap: 8px; margin-top: 18px; }
  .bl-swipe__dots button, .bl-swipe__dots button:hover, .bl-swipe__dots button:focus { width: 26px; height: 4px; padding: 0; border: 0; border-radius: 4px; background: rgba(255,255,255,.2); transition: background .25s, width .25s; cursor: pointer; }
  .bl-swipe__dots button[aria-current="true"] { background: var(--bl-orange); width: 40px; }
}
/* Service/text cards don't get the photo overlay */
.bl-swipe > .e-loop-item > .e-con::after { display: none; }

/* ---------- Mobile alignment: centre contact details, footer and buttons ---------- */
@media (max-width: 767px) {
  .elementor-location-footer .elementor-widget-heading .elementor-heading-title,
  .elementor-location-footer .elementor-widget-text-editor,
  .elementor-location-footer .elementor-widget-image-box .elementor-image-box-content,
  .elementor-location-footer .elementor-widget-image { text-align: center !important; }
  .elementor-location-footer .elementor-icon-list-items,
  .elementor-location-footer .elementor-social-icons-wrapper { justify-content: center !important; }
  .elementor-location-footer .elementor-icon-list-item { justify-content: center !important; }
  .elementor-location-footer .e-con, .elementor-location-footer .e-con-inner { align-items: center !important; }
  /* Email / phone rows next to forms */
  .elementor-widget-icon-list .elementor-icon-list-items:not(.elementor-inline-items) { display: inline-flex; flex-direction: column; align-items: flex-start; }
  .elementor-widget-icon-list:has(a[href^="mailto:"]), .elementor-widget-icon-list:has(a[href^="tel:"]) { text-align: center; }
  .elementor-location-header .elementor-widget-icon-list { text-align: initial; }
  .elementor-location-header .elementor-widget-icon-list .elementor-icon-list-items { display: flex; }
  /* Buttons */
  .elementor-widget-button .elementor-button-wrapper { text-align: center !important; }
  .elementor-widget-heading:has(+ .elementor-widget-text-editor + .elementor-widget-button) .elementor-heading-title { text-align: center; }
}

/* Story section without a photo: text stays in the same column so the timeline runs straight, with no empty gap */
.single-project .bl-entry--noimg, .single-project .bl-entry--noimg > .e-con, .single-project .bl-entry--noimg .e-con { --min-height: 0px !important; min-height: 0 !important; }
@media (min-width: 1025px) {
  .single-project .bl-entry--noimg > .e-con { --width: 50% !important; width: 50% !important; margin-left: 50% !important; }
}
@media (max-width: 1024px) {
  .single-project .bl-entry--noimg > .e-con { --width: 100% !important; width: 100% !important; }
}

/* "Why choose" on phones/tablets (the stacked version): photos wipe in, text rises */
.bl-why-m .elementor-element.elementor-invisible { visibility: visible !important; }
.bl-why-m .elementor-element.animated { animation: none !important; }
.bl-wipe { clip-path: inset(0 0 100% 0); transition: clip-path 1s cubic-bezier(.7,0,.2,1); }
.bl-wipe img { scale: 1.12; transition: scale 1.4s cubic-bezier(.2,.8,.2,1); }
.bl-wipe.is-in { clip-path: inset(0 0 0 0); }
.bl-wipe.is-in img { scale: 1; }
.bl-rise { opacity: 0; translate: 0 28px; transition: opacity .7s ease var(--bl-delay, 0ms), translate .8s cubic-bezier(.16,.84,.24,1) var(--bl-delay, 0ms); }
.bl-rise.is-in { opacity: 1; translate: 0 0; }
@media (prefers-reduced-motion: reduce) { .bl-wipe, .bl-wipe img, .bl-rise { clip-path: none; scale: none; opacity: 1; translate: none; } }

/* ---------- Homepage intro: line-drawn logo, then a curtain reveal into the site ---------- */
/* site.js measures every letter so they all draw evenly (the original used one fixed dash length) */
.logo-fade svg path.word1, .logo-fade svg path.word2 { animation: none !important; }
.bl-intro .logo-fade svg path { stroke-width: 2.2; fill: transparent; transition: stroke-dashoffset 1.15s cubic-bezier(.65,0,.35,1) var(--d, 0ms), fill .6s ease, stroke-opacity .6s ease; }
.bl-intro .logo-fade svg path.word1 { stroke: #C3B9B4; }
.bl-intro .logo-fade svg path.word2 { stroke: #E97B48; }
.bl-intro.is-drawn .logo-fade svg path { stroke-dashoffset: 0 !important; }
.bl-intro.is-filled .logo-fade svg path.word1 { fill: #C3B9B4; stroke-opacity: 0; }
.bl-intro.is-filled .logo-fade svg path.word2 { fill: #E97B48; stroke-opacity: 0; }
.bl-intro .logo-fade .elementor-widget-container::after { content: ""; display: block; height: 2px; width: min(180px, 30vw); margin: clamp(18px, 3vw, 32px) auto 0;
  background: linear-gradient(90deg, #FF8142, #FF8142) no-repeat left / 0 100%, rgba(255,255,255,.08); transition: background-size 1.1s cubic-bezier(.6,0,.2,1) .2s; }
.bl-intro.is-drawn .logo-fade .elementor-widget-container::after { background-size: 100% 100%, auto; }
/* Exit: the logo lifts away while the black screen sweeps up like a curtain */
.bl-intro .logo-fade svg { transition: transform .8s cubic-bezier(.7,0,.2,1), opacity .5s ease; }
.bl-intro.bl-intro-out .logo-fade svg { transform: translateY(-36px) scale(.96); opacity: 0; }
.bl-intro.bl-intro-out .logo-fade .elementor-widget-container::after { opacity: 0; transition: opacity .3s ease; }
.elementor-popup-modal.bl-intro { transition: clip-path 1s cubic-bezier(.76,0,.24,1) .18s; clip-path: inset(0 0 0 0); }
.elementor-popup-modal.bl-intro.bl-intro-out { clip-path: inset(0 0 100% 0); }
/* Hero content waits behind the curtain, then rises in as it lifts */
html.bl-intro-hold .elementor-element-06dec56 .elementor-widget { opacity: 0 !important; }
html.bl-intro-release .elementor-element-06dec56 .elementor-widget { visibility: visible !important; animation: blHeroIn 1s cubic-bezier(.16,.84,.24,1) both !important; }
html.bl-intro-release .elementor-element-06dec56 .elementor-widget:nth-child(2) { animation-delay: .5s !important; }
html.bl-intro-release .elementor-element-06dec56 .elementor-widget:nth-child(3) { animation-delay: .6s !important; }
html.bl-intro-release .elementor-element-06dec56 .elementor-widget:nth-child(4) { animation-delay: .7s !important; }
html.bl-intro-release .elementor-element-06dec56 .elementor-widget:nth-child(5) { animation-delay: .78s !important; }
html.bl-intro-release .elementor-element-06dec56 .elementor-widget:nth-child(n+6) { animation-delay: .86s !important; }
html.bl-intro-release .elementor-element-06dec56 .elementor-widget:first-child { animation-delay: .42s !important; }
@keyframes blHeroIn { from { opacity: 0; transform: translate3d(0, 34px, 0); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .bl-intro .logo-fade svg path, .elementor-popup-modal.bl-intro { transition: none !important; } html.bl-intro-release .elementor-element-06dec56 .elementor-widget { animation: none !important; } }

/* ---------- Phone polish (from the 360/390px audit) ---------- */
/* No sideways scrolling anywhere; `clip` (unlike `hidden`) keeps sticky/pinned sections working */
html, body { overflow-x: clip; }
.single-project .elementor-element-7ad061a { max-width: 100vw; }
@media (max-width: 767px) {
  /* Oversized headings on the location pages ("We Serve Clients Across ...") */
  .elementor-element-e012983 .elementor-heading-title { font-size: clamp(30px, 9.5vw, 42px) !important; line-height: 1.1 !important; }
  /* Big headings never wider than the screen */
  /* Break a word only when it genuinely cannot fit. "anywhere" was splitting ordinary words
     mid-way, so headings read as "Development / s". */
  .elementor-widget-heading .elementor-heading-title { overflow-wrap: break-word; hyphens: manual; }
  /* Comfortable tap areas without moving anything: pad the hit area, pull the layout back */
  .elementor-location-header .elementor-icon-list-item > a { padding: 10px 4px; margin: -10px -4px; }
  .elementor-widget-icon-list .elementor-icon-list-item > a,
  .elementor-icon-box-title a, .elementor-widget-text-editor p a, .elementor-image-box-title a { padding-block: 9px; margin-block: -9px; display: inline-block; }
  .e-loop-item .elementor-widget-button .elementor-button { padding-block: 12px !important; margin-block: -6px; }
  .skip-link { width: auto; height: auto; }
  /* Section spacing is left as the design sets it. An earlier attempt to cap it wrote
     --padding-top: min(var(--padding-top, 60px), 64px), which reads the property it is defining.
     That makes it invalid, so every boxed section on the page silently lost its top and bottom
     padding on phones. */
  /* Body text readable, not tiny */
  .elementor-widget-text-editor { font-size: max(1em, 15px); }
}

/* ---------- Site-wide motion polish: one calm, consistent entrance for every section ---------- */
:root { --bl-ease: cubic-bezier(.16,.84,.24,1); }
.elementor-element.animated { animation-duration: .95s !important; animation-timing-function: var(--bl-ease) !important; animation-fill-mode: both; }
.elementor-element.animated.animated-fast { animation-duration: .8s !important; }
.elementor-element.animated.animated-slow { animation-duration: 1.2s !important; }
@keyframes fadeInUp { from { opacity: 0; transform: translate3d(0, 28px, 0); } to { opacity: 1; transform: none; } }
@keyframes fadeInLeft { from { opacity: 0; transform: translate3d(-36px, 0, 0); } to { opacity: 1; transform: none; } }
@keyframes fadeInRight { from { opacity: 0; transform: translate3d(36px, 0, 0); } to { opacity: 1; transform: none; } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes slideInRight { from { opacity: 0; transform: translate3d(48px, 0, 0); } to { opacity: 1; transform: none; } }
@keyframes zoomIn { from { opacity: 0; transform: scale3d(.94, .94, .94); } to { opacity: 1; transform: none; } }
/* Images ease in with a soft scale rather than sliding */
.elementor-widget-image.animated { animation-name: blImgIn !important; animation-duration: 1.1s !important; }
@keyframes blImgIn { from { opacity: 0; transform: scale(1.04); filter: blur(6px); } to { opacity: 1; transform: none; filter: none; } }

/* Hover: linked photos zoom gently inside their frame; buttons share one transition */
.elementor-widget-image a { display: block; overflow: hidden; }
.elementor-widget-image a img { transition: transform .9s var(--bl-ease), filter .5s ease; }
.elementor-widget-image a:hover img { transform: scale(1.04); }
.elementor-button { transition: background-color .25s ease, color .25s ease, border-color .25s ease, box-shadow .3s ease, transform .3s var(--bl-ease) !important; }
.elementor-button:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(0,0,0,.35); }
.elementor-button:active { transform: translateY(0); }

/* FAQs slide open (progressive: browsers without support just open instantly) */
@supports (interpolate-size: allow-keywords) {
  :root { interpolate-size: allow-keywords; }
  .e-n-accordion-item::details-content { height: 0; overflow: clip; transition: height .4s var(--bl-ease), content-visibility .4s allow-discrete; }
  .e-n-accordion-item[open]::details-content { height: auto; }
}
.e-n-accordion-item-title { transition: color .2s ease, background-color .2s ease; }
.e-n-accordion-item-title-icon { transition: transform .3s var(--bl-ease); }

@media (prefers-reduced-motion: reduce) {
  .elementor-element.animated { animation: none !important; }
  .elementor-button:hover, .elementor-widget-image a:hover img { transform: none; }
}

/* ---------- Privacy Policy / Terms of Service ---------- */
.bl-legal { max-width: 1140px; margin: 0 auto; padding: clamp(130px, 16vw, 190px) 24px clamp(64px, 9vw, 110px); color: #d9d2cd; font-family: "Inter", sans-serif; }
.bl-legal__head { border-bottom: 1px solid var(--bl-line); padding-bottom: 28px; margin-bottom: 40px; }
.bl-legal__head .elementor-heading-title { font-family: "Clash Display", "Inter", sans-serif; font-weight: 500; font-size: clamp(38px, 6vw, 64px); line-height: 1.05; color: #fff; margin: 0; letter-spacing: -.01em; }
.bl-legal__date { margin: 14px 0 0; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--bl-orange); }
.bl-legal__grid { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.bl-legal__toc { position: sticky; top: 120px; font-size: 14px; }
.bl-legal__toc p { margin: 0 0 12px; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--bl-muted); }
.bl-legal__toc ul { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--bl-line); }
.bl-legal__toc a { display: block; padding: 7px 0 7px 16px; margin-left: -1px; border-left: 1px solid transparent; color: #bdb3ae !important; text-decoration: none; transition: color .2s, border-color .2s; }
.bl-legal__toc a:hover { color: #fff !important; border-left-color: var(--bl-orange); }
.bl-legal__body { max-width: 720px; font-size: 16.5px; line-height: 1.75; }
.bl-legal__body .bl-legal__lede { font-size: 19px; line-height: 1.6; color: #fff; margin: 0 0 8px; }
.bl-legal__body h2 { font-family: "Clash Display", "Inter", sans-serif; font-weight: 500; font-size: clamp(24px, 3vw, 30px); color: #fff; margin: 48px 0 14px; scroll-margin-top: 110px; }
.bl-legal__body h3 { font-family: "Inter", sans-serif; font-weight: 600; font-size: 16px; color: #fff; margin: 26px 0 8px; }
.bl-legal__body p { margin: 0 0 14px; }
.bl-legal__body ul { margin: 0 0 16px; padding-left: 20px; }
.bl-legal__body li { margin: 0 0 8px; }
.bl-legal__body li::marker { color: var(--bl-orange); }
.bl-legal__body a { color: var(--bl-orange) !important; text-decoration: underline; text-underline-offset: 3px; }
.bl-legal__body strong { color: #fff; font-weight: 600; }
@media (max-width: 900px) {
  .bl-legal__grid { grid-template-columns: 1fr; }
  .bl-legal__toc { position: static; padding: 18px 20px; border: 1px solid var(--bl-line); background: rgba(255,255,255,.02); }
  .bl-legal__toc ul { border-left: 0; columns: 2; column-gap: 20px; }
  .bl-legal__toc a { padding: 8px 0; margin: 0; border: 0; }
}
@media (max-width: 480px) { .bl-legal__toc ul { columns: 1; } .bl-legal__body { font-size: 16px; } }
/* Legal pages sit on the site's dark background (the page shell they're built from is light) */
body:has(.bl-legal), body:has(.bl-legal) [data-elementor-type="wp-page"] { background: #01050C !important; }
body:has(.bl-legal) .elementor-location-header .cust_header { background: rgba(1,5,12,.86) !important; }
.bl-legal__body, .bl-legal__body p, .bl-legal__body li, .bl-legal__body .elementor-widget-container { color: #d6cec9 !important; }

/* ---------- Homepage hero on phones ---------- */
@media (max-width: 767px) {
  /* Size the heading to the screen. The hero's own spacing already clears the header, so do not
     add top padding here: it pushed the heading a long way down the screen. */
  .elementor-element-cabd5fa .elementor-heading-title { font-size: clamp(32px, 10vw, 44px) !important; line-height: 0.95em !important; }
  /* Header phone number on one line */
  .elementor-location-header .elementor-icon-list-text { white-space: nowrap; }
}
@media (max-width: 380px) {
  .elementor-location-header .elementor-icon-list-text { font-size: 12.5px !important; }
}

/* ---------- "We Serve Clients Across ..." place links ---------- */
.bl-places .elementor-widget-button .elementor-button,
.bl-places .elementor-widget-button .elementor-button:hover,
.bl-places .elementor-widget-button .elementor-button:focus {
  position: relative; background: transparent !important; box-shadow: none !important; transform: none !important;
  border: 0 !important; border-radius: 0 !important; padding: 14px 0 !important; width: 100%;
}
.bl-places .elementor-widget-button .elementor-button { color: #fff !important; transition: color .3s ease !important; }
.bl-places .elementor-widget-button .elementor-button-content-wrapper { justify-content: space-between; gap: 24px !important; }
.bl-places .elementor-widget-button .elementor-button::before,
.bl-places .elementor-widget-button .elementor-button::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; }
.bl-places .elementor-widget-button .elementor-button::before { background: rgba(255,255,255,.35); }
.bl-places .elementor-widget-button .elementor-button::after { height: 2px; background: #01050C; transform: scaleX(0); transform-origin: left; transition: transform .45s cubic-bezier(.2,.8,.2,1); }
.bl-places .elementor-widget-button .elementor-button-icon { transition: transform .35s cubic-bezier(.2,.8,.2,1); }
.bl-places .elementor-widget-button .elementor-button-icon svg, .bl-places .elementor-widget-button .elementor-button-icon svg path { fill: currentColor !important; }
.bl-places .elementor-widget-button .elementor-button:hover,
.bl-places .elementor-widget-button .elementor-button:focus-visible { color: #01050C !important; }
.bl-places .elementor-widget-button .elementor-button:hover::after,
.bl-places .elementor-widget-button .elementor-button:focus-visible::after { transform: scaleX(1); }
.bl-places .elementor-widget-button .elementor-button:hover .elementor-button-icon,
.bl-places .elementor-widget-button .elementor-button:focus-visible .elementor-button-icon { transform: translateX(8px); }
.bl-places .elementor-widget-button .elementor-button:focus-visible { outline: 2px solid #01050C; outline-offset: 4px; }
/* The place-link column was squeezed by 250px side padding: give it room */
@media (min-width: 1025px) {
  .e-con.bl-places { --padding-left: clamp(48px, 7vw, 120px) !important; --padding-right: clamp(48px, 7vw, 120px) !important; }
}
.bl-places .elementor-widget-button .elementor-button-text { white-space: nowrap; }
.bl-places .elementor-widget-button { width: 100%; max-width: 440px; }

/* ---------- Project story photos: always fill the frame (they tiled when the upload's size didn't match) ---------- */
.single-project .elementor-element-7ca86349 .e-con,
.single-project .bl-entry__photo {
  background-size: cover !important; background-position: center !important; background-repeat: no-repeat !important;
}
@media (min-width: 768px) { .single-project .bl-entry__photo { min-height: 320px; } }
@media (max-width: 767px) { .single-project .bl-entry__photo { --min-height: 0px; min-height: 0 !important; aspect-ratio: 4 / 3; width: 100%; } }
/* Every background photo in a card or section: cover, never repeat */
.e-loop-item > .e-con, .e-con[data-settings*="background_background"] { background-repeat: no-repeat; }
.e-loop-item > .e-con { background-size: cover !important; background-position: center !important; }

/* ---------- Whole card is clickable (not just the title) ---------- */
.e-loop-item { cursor: pointer; }
.bl-card-link { position: absolute; inset: 0; z-index: 2; border-radius: inherit; }
.bl-card-link:focus-visible { outline: 2px solid var(--bl-orange); outline-offset: -4px; }
.e-loop-item > .e-con a:not(.bl-card-link), .e-loop-item > .e-con button { position: relative; z-index: 3; }
.e-loop-item > .e-con > .bl-card-link { position: absolute !important; inset: 0; z-index: 4 !important; }

/* Contact Us page intro (the page had no heading of its own) */
.bl-page-intro { max-width: 900px; margin: 0 auto; padding: clamp(140px, 17vw, 200px) 24px clamp(8px, 2vw, 24px); text-align: center; }
.bl-page-intro .elementor-heading-title { font-family: "Clash Display", "Inter", sans-serif; font-weight: 500; font-size: clamp(40px, 7vw, 76px); line-height: 1.02; color: #fff; margin: 0; letter-spacing: -.01em; }
.bl-page-intro .elementor-widget-text-editor { margin-top: 18px; font-size: clamp(16px, 1.6vw, 19px); line-height: 1.6; color: #d6cec9; }
.bl-page-intro .elementor-widget-text-editor a { color: var(--bl-orange) !important; white-space: nowrap; }

/* ---------- Sections added through the portal (text, image_text, cta, cards, gallery, quote, faq) ---------- */
.bl-sec { --bl-sec-bg: #01050C; --bl-sec-fg: #fff; --bl-sec-muted: #cfc7c2; background: var(--bl-sec-bg); color: var(--bl-sec-fg);
  padding: clamp(64px, 9vw, 120px) max(24px, calc((100% - 1200px) / 2)); display: block !important; }
.bl-sec--light { --bl-sec-bg: #F6F3F1; --bl-sec-fg: #01050C; --bl-sec-muted: #4a4543; }
.bl-sec--accent { --bl-sec-bg: var(--bl-orange); --bl-sec-fg: #fff; --bl-sec-muted: rgba(255,255,255,.88); }
.bl-sec .elementor-heading-title { font-family: "Clash Display", "Inter", sans-serif; font-weight: 500; color: var(--bl-sec-fg) !important; letter-spacing: -.01em; margin: 0; }
.bl-sec h2.elementor-heading-title { font-size: clamp(30px, 4.4vw, 52px); line-height: 1.08; }
.bl-sec h3.elementor-heading-title { font-size: clamp(20px, 2vw, 24px); line-height: 1.2; }
.bl-sec .elementor-widget-text-editor, .bl-sec .elementor-widget-text-editor p { color: var(--bl-sec-muted) !important; font-size: clamp(16px, 1.3vw, 18px); line-height: 1.7; }
.bl-sec .elementor-widget-text-editor p { margin: 0 0 12px; }
.bl-sec .elementor-widget + .elementor-widget { margin-top: 18px; }
.bl-sec__eyebrow { margin: 0 0 14px; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--bl-orange); }
.bl-sec--accent .bl-sec__eyebrow { color: #fff; opacity: .85; }
.bl-sec__narrow { max-width: 760px; margin: 0 auto; text-align: center; }
.bl-sec .elementor-button { display: inline-flex; align-items: center; justify-content: center; min-height: 54px; padding: 0 32px !important; border-radius: 0; background: var(--bl-orange) !important; color: #fff !important;
  font-family: "Clash Display", "Inter", sans-serif; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; font-size: 14px; }
.bl-sec--accent .elementor-button { background: #01050C !important; }
.bl-sec--light .elementor-button { background: #01050C !important; }
.bl-sec .elementor-widget-button { margin-top: 28px !important; }
.bl-sec__split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 5vw, 80px); align-items: center; }
.bl-sec__split--reverse .bl-sec__media { order: 2; }
.bl-sec__media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.bl-sec__cta { max-width: 900px; margin: 0 auto; text-align: center; }
.bl-sec__cards { display: grid; gap: 20px; margin-top: 44px; }
.bl-sec__cards--2 { grid-template-columns: repeat(2, 1fr); } .bl-sec__cards--3 { grid-template-columns: repeat(3, 1fr); } .bl-sec__cards--4 { grid-template-columns: repeat(4, 1fr); }
.bl-sec__card { padding: 28px; border: 1px solid rgba(255,255,255,.1); background: rgba(255,255,255,.02); text-align: left; transition: border-color .3s, transform .3s; }
.bl-sec--light .bl-sec__card { border-color: rgba(1,5,12,.1); background: #fff; }
.bl-sec__card:hover { border-color: var(--bl-orange); transform: translateY(-3px); }
.bl-sec__card-media { margin: -28px -28px 22px; }
.bl-sec__card-media img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; display: block; }
.bl-sec__gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 40px; }
.bl-sec__tile { margin: 0 !important; overflow: hidden; }
.bl-sec__tile img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; display: block; transition: transform .9s cubic-bezier(.2,.8,.2,1); }
.bl-sec__tile:hover img { transform: scale(1.05); }
.bl-sec__quote-text p { font-family: "Clash Display", "Inter", sans-serif; font-size: clamp(22px, 3vw, 34px) !important; line-height: 1.35 !important; color: var(--bl-sec-fg) !important; }
.bl-sec__quote-by .elementor-heading-title { font-family: "Inter", sans-serif !important; font-size: 14px; letter-spacing: .12em; text-transform: uppercase; color: var(--bl-orange) !important; }
.bl-sec__faq { margin-top: 36px; text-align: left; border-top: 1px solid rgba(255,255,255,.12); }
.bl-sec--light .bl-sec__faq, .bl-sec--light .bl-faq { border-color: rgba(1,5,12,.12); }
.bl-faq { border-bottom: 1px solid rgba(255,255,255,.12); }
.bl-faq__q, .bl-faq__q:hover, .bl-faq__q:focus { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 22px 0; background: none !important; border: 0; color: inherit; cursor: pointer; text-align: left; }
.bl-faq__q .elementor-widget { margin: 0 !important; }
.bl-faq__icon { position: relative; width: 16px; height: 16px; flex: none; }
.bl-faq__icon::before, .bl-faq__icon::after { content: ""; position: absolute; left: 0; right: 0; top: 7px; height: 2px; background: var(--bl-orange); transition: transform .3s ease; }
.bl-faq__icon::after { transform: rotate(90deg); }
.bl-faq.is-open .bl-faq__icon::after { transform: rotate(0); }
.bl-faq__a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .35s cubic-bezier(.2,.8,.2,1); }
.bl-faq__a > * { overflow: hidden; }
.bl-faq.is-open .bl-faq__a { grid-template-rows: 1fr; }
.bl-faq.is-open .bl-faq__a .elementor-widget-text-editor { padding-bottom: 20px; }
.bl-rev { opacity: 0; translate: 0 28px; transition: opacity .8s ease var(--bl-delay, 0ms), translate .9s cubic-bezier(.16,.84,.24,1) var(--bl-delay, 0ms); }
.bl-rev.is-in { opacity: 1; translate: 0 0; }
@media (max-width: 1024px) { .bl-sec__cards--4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) {
  .bl-sec__split, .bl-sec__cards--2, .bl-sec__cards--3, .bl-sec__cards--4 { grid-template-columns: 1fr; }
  .bl-sec__split--reverse .bl-sec__media { order: 0; }
  .bl-sec__gallery { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .bl-sec .elementor-button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .bl-rev { opacity: 1; translate: none; transition: none; } }

/* ---------- Animation library (applied from the portal) ----------
   Entrances use keyframe animations (not transitions) so they never clash with an element's own
   transitions, and hover effects use transform/box-shadow so they never clash with entrances. */
.bl-anim { --bl-anim-dur: 900ms; --bl-anim-delay: 0ms; --bl-anim-ease: cubic-bezier(.16,.84,.24,1); }
.bl-anim.elementor-invisible, [data-bl-anim].elementor-invisible, [data-bl-stagger] .elementor-invisible { visibility: visible !important; }
[data-bl-stagger] .animated { animation-name: none; }
.bl-anim:not(.is-in):not(.bl-anim--wipe-up):not(.bl-anim--wipe-left) { opacity: 0; }
.bl-anim--wipe-up:not(.is-in) { clip-path: inset(100% 0 0 0); }
.bl-anim--wipe-left:not(.is-in) { clip-path: inset(0 100% 0 0); }
.bl-anim.is-in { animation-duration: var(--bl-anim-dur) !important; animation-delay: var(--bl-anim-delay) !important; animation-timing-function: var(--bl-anim-ease) !important; animation-fill-mode: both !important; }
.bl-anim--fade-up.is-in { animation-name: blA-fade-up !important; }
.bl-anim--fade-in.is-in { animation-name: blA-fade-in !important; }
.bl-anim--from-left.is-in, .bl-anim--slide-left.is-in { animation-name: blA-from-left !important; }
.bl-anim--from-right.is-in, .bl-anim--slide-right.is-in { animation-name: blA-from-right !important; }
.bl-anim--zoom-in.is-in { animation-name: blA-zoom-in !important; }
.bl-anim--blur-in.is-in { animation-name: blA-blur-in !important; }
.bl-anim--wipe-up.is-in { animation-name: blA-wipe-up !important; --bl-anim-ease: cubic-bezier(.7,0,.2,1); }
.bl-anim--wipe-left.is-in { animation-name: blA-wipe-left !important; --bl-anim-ease: cubic-bezier(.7,0,.2,1); }
@keyframes blA-fade-up { from { opacity: 0; translate: 0 36px; } to { opacity: 1; translate: 0 0; } }
@keyframes blA-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes blA-from-left { from { opacity: 0; translate: -48px 0; } to { opacity: 1; translate: 0 0; } }
@keyframes blA-from-right { from { opacity: 0; translate: 48px 0; } to { opacity: 1; translate: 0 0; } }
@keyframes blA-zoom-in { from { opacity: 0; scale: .92; } to { opacity: 1; scale: 1; } }
@keyframes blA-blur-in { from { opacity: 0; filter: blur(12px); } to { opacity: 1; filter: blur(0); } }
@keyframes blA-wipe-up { from { clip-path: inset(100% 0 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes blA-wipe-left { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
[data-bl-parallax] { will-change: translate; }
/* Hover effects */
.bl-hover-lift { transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease; }
.bl-hover-lift:hover { transform: translateY(-6px); box-shadow: 0 18px 40px rgba(0,0,0,.35); }
.bl-hover-zoom { overflow: hidden; }
.bl-hover-zoom img { transition: transform .9s cubic-bezier(.2,.8,.2,1); }
.bl-hover-zoom:hover img { transform: scale(1.06); }
.bl-hover-glow { transition: box-shadow .35s ease; }
.bl-hover-glow:hover { box-shadow: 0 0 0 1px var(--bl-orange), 0 0 32px rgba(255,129,66,.35); }
.bl-hover-underline .elementor-heading-title, .bl-hover-underline a { background: linear-gradient(currentColor, currentColor) no-repeat 0 100% / 0 2px; transition: background-size .4s ease; }
.bl-hover-underline:hover .elementor-heading-title, .bl-hover-underline:hover a { background-size: 100% 2px; }
@media (prefers-reduced-motion: reduce) { .bl-anim, .bl-anim.is-in { animation: none !important; opacity: 1 !important; clip-path: none !important; } .bl-hover-lift:hover { transform: none; } }

/* ---------- Inner page titles clearing the header on a phone ---------- */
/* The header bar is positioned over the top of the page, and at 767px and under these three
   heroes lose their top padding, so the title sits behind the logo and phone number. The home
   page and Contact page set their own spacing and are left alone. */
@media (max-width: 767px) {
  .elementor-element-2c10048,   /* Our Services */
  .elementor-element-3bfa68f,   /* About Us */
  .elementor-element-f3c055d {  /* Projects */
    padding-top: 120px !important;
  }
}

/* ---------- One mobile side gutter everywhere ---------- */
/* The site sets 20px either side of content on a phone, but a few sections never got it: the
   thank-you page ran right to the edges, the Property Development Process heading sat at 0, and
   the "We Serve Clients Across ..." heading at 10. Anything tighter than the rest of the site
   looks like a mistake, so they all match now. */
:root { --bl-gutter: 20px; }

@media (max-width: 767px) {
  /* 20px is not much room for headings this size: the type crowds both edges on a phone. This
     adds a little inside every top-level section, so sections that had 20px now read at 30 and
     ones that already had more keep their extra. Backgrounds and full-bleed photos are
     untouched, because the padding is on the content wrapper. */
  [data-elementor-type="wp-page"] > .e-con.e-parent > .e-con-inner,
  [data-elementor-type="wp-post"] > .e-con.e-parent > .e-con-inner,
  [data-elementor-type="single-post"] > .e-con.e-parent > .e-con-inner,
  [data-elementor-type="archive"] > .e-con.e-parent > .e-con-inner,
  /* Full-width sections have no inner wrapper, so the room goes on the section itself. */
  [data-elementor-type="wp-page"] > .e-con.e-parent.e-con-full,
  [data-elementor-type="wp-post"] > .e-con.e-parent.e-con-full,
  [data-elementor-type="single-post"] > .e-con.e-parent.e-con-full {
    padding-left: 10px;
    padding-right: 10px;
  }
  /* Pages built through the portal carry their own gutter. */
  .bl-legal, .bl-page-intro { padding-left: 30px; padding-right: 30px; }

  .elementor-element-35517a9,   /* Thank you hero */
  .elementor-element-b5e8b77,   /* Property Development Process heading */
  .elementor-element-7a0d296 {  /* We Serve Clients Across ... */
    padding-left: var(--bl-gutter) !important;
    padding-right: var(--bl-gutter) !important;
  }
  /* Pages added through the portal used 24px; bring them in line with the rest of the site. */
  .bl-sec { padding-left: var(--bl-gutter) !important; padding-right: var(--bl-gutter) !important; }
}

/* The service pages open with a breadcrumb sitting at the very top of the page, which the header
   bar is drawn over. Give it room to clear the header on a phone. */
@media (max-width: 767px) {
  .elementor-element-c653493 { padding-top: 104px !important; }
}

/* "Developments" is a few pixels wider than a phone screen at the hero size, so the title broke
   as "Development / s". A slightly smaller size on phones keeps the word whole. Other page
   titles already fit and are left alone. */
@media (max-width: 767px) {
  .elementor-element-39bc3b6 .elementor-heading-title { font-size: 44px !important; }
}