:root {
  --bf-primary: #00A6A6;
  --bf-primary-light: #4DCFCF;
  --bf-primary-dark: #007575;
  --bf-dark: #111111;
}

/* ---- extracted block 1 ---- */
#bfSiteHeader .bf-main { height: var(--bf-main-height) !important; min-height: var(--bf-main-height) !important; padding: 0 !important; } #bfSiteHeader .bf-main-shell { height: var(--bf-main-height) !important; padding-top: 0 !important; padding-bottom: 0 !important; } .page-sections:empty { display: none !important; height: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; }

/* ---- extracted block 2 ---- */
h1, .source-sans { font-family: 'Source Sans Pro', sans-serif; } h2, .mako { font-family: 'Mako', sans-serif; } p, .muli { font-family: 'Muli', sans-serif; } .project-item:before { display: none; } .blog-info { background-image: none; } .contact-head-info { margin-top: 3px; } .main-banner { padding: 100px 0 0px; } /* header { *//* top: 20px; *//* } */

/* ---- extracted block 3 ---- */
.bf-hero { position: relative; height: clamp(500px, 43.75vw, 700px); overflow: hidden; width: 100%; padding: 0; margin: 0; font-family: inherit; } .bf-hero::before { content: ""; position: absolute; left: 0; top: 0; width: min(72%, 1150px); height: 100%; z-index: 2; pointer-events: none; background: linear-gradient(90deg,
            rgba(0, 0, 0, 0.78) 0%,
            rgba(0, 0, 0, 0.64) 34%,
            rgba(0, 0, 0, 0.34) 66%,
            rgba(0, 0, 0, 0.10) 86%,
            rgba(0, 0, 0, 0) 100%); } .overlay { position: absolute; left: 0; top: 0; height: 100%; width: min(58%, 900px); display: flex; align-items: center; padding: 54px clamp(32px, 4vw, 64px) 54px clamp(48px, 5vw, 84px); box-sizing: border-box; z-index: 2; } .overlay-content { display: none; max-width: 760px; color: #fff; } .overlay-content.active { display: block; transform: translateY(30px); } .overlay h1, .overlay h2 { font-family: 'Source Sans Pro', Arial, sans-serif; font-size: clamp(28px, 2.5vw, 42px); line-height: 1.12; font-weight: 700; color: #fff; margin: 0 0 14px; letter-spacing: 0; text-shadow: 0 10px 28px rgba(0, 0, 0, 0.45); } .overlay p { font-family: 'Mako', Arial, sans-serif; font-size: 17px; line-height: 1.5; color: rgba(255, 255, 255, 0.9); opacity: 1; margin: 0 0 22px; text-shadow: 0 6px 18px rgba(0, 0, 0, 0.45); } .headline-accent { color: var(--bf-primary); } .hero-line { width: min(320px, 80%); height: 1px; margin: 8px 0 22px; background: linear-gradient(90deg, var(--bf-primary), rgba(0, 166, 0, 0.05)); } .portfolio-btn { display: inline-block; padding: 14px 28px; border-radius: 8px; background: linear-gradient(135deg, var(--bf-primary) 0%, var(--bf-primary-dark) 100%); color: #fff; font-weight: 700; text-decoration: none; transition: transform 0.25s ease, box-shadow 0.25s ease; box-shadow: 0 14px 32px rgba(0, 117, 0, 0.38); } .portfolio-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 38px rgba(0, 117, 0, 0.46); } .portfolio-btn .btn-arrow { display: inline-block; margin-left: 18px; font-size: 22px; line-height: 0; transition: transform 0.2s ease; } .portfolio-btn:hover .btn-arrow { transform: translateX(5px); } .contact-form { position: absolute; right: clamp(90px, 8vw, 150px); top: calc(50% + 24px); width: 100%; max-width: 400px; transform: translateY(-50%); background: #ffffff; border: 2px solid rgba(51, 197, 77, 0.86); border-radius: 16px; overflow: hidden; box-shadow: 0 28px 70px rgba(0, 0, 0, 0.48), 0 0 0 1px rgba(255, 255, 255, 0.08), 0 0 42px rgba(0, 166, 0, 0.34); z-index: 5; } .contact-form .form-header { position: relative; padding: 14px 22px 12px; background: linear-gradient(135deg, rgba(10, 10, 10, 0.98), rgba(31, 16, 5, 0.96)); overflow: hidden; } .contact-form .form-header::before { content: ""; position: absolute; top: -40px; right: -40px; width: 160px; height: 160px; background: radial-gradient(circle, rgba(0, 117, 117, 0, 0.55) 0%, transparent 70%); border-radius: 50%; animation: orbFloat 4s ease-in-out infinite alternate; } .contact-form .form-header::after { content: ""; position: absolute; bottom: -30px; left: 20px; width: 100px; height: 100px; background: radial-gradient(circle, rgba(0, 166, 166, 0, 0.3) 0%, transparent 70%); border-radius: 50%; animation: orbFloat 5s ease-in-out infinite alternate-reverse; } @keyframes orbFloat { from {  transform: translate(0, 0) scale(1); }  to {  transform: translate(8px, -8px) scale(1.1); } } .contact-form .header-inner { position: relative; z-index: 2; display: flex; align-items: center; gap: 10px; } .contact-form .header-text h3 { font-size: 16px; color: #fff; letter-spacing: 0; line-height: 1.1; margin: 0; } .contact-form .header-text p { font-size: 12px; margin-top: 4px; font-weight: 500; color: rgba(255, 255, 255, 0.86); } .contact-form .live-badge { margin-left: auto; display: flex; align-items: center; gap: 5px; background: rgba(34, 197, 94, 0.15); border: 1px solid rgba(34, 197, 94, 0.3); color: #4ade80; font-size: 11px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; padding: 4px 8px; border-radius: 100px; flex-shrink: 0; } .contact-form .live-dot { width: 5px; height: 5px; background: #4ade80; border-radius: 50%; animation: blink 1.2s infinite; } @keyframes blink { 0%, 100% {  opacity: 1; }  50% {  opacity: 0.2; } } .contact-form .form-body { padding: 16px 22px 18px; background: linear-gradient(145deg, #ffffff 0%, #f8f8f8 100%); } .contact-form .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 8px; } .contact-form .form-group { display: flex; flex-direction: column; gap: 3px; min-width: 0; } .contact-form .form-group.full { grid-column: 1 / -1; } .contact-form label { font-size: 11px; font-weight: 600; color: #374151; letter-spacing: 0.8px; display: flex; align-items: center; gap: 3px; } .contact-form .req { color: var(--bf-primary-dark); } .contact-form input, .contact-form textarea { width: 100%; padding: 7px 10px; border: 1.5px solid #e1e5ec; border-radius: 8px; font-size: 12.5px; font-weight: 500; color: #111; -webkit-text-fill-color: #111; background: #fbfbfc; transition: all 0.18s ease; outline: none; box-sizing: border-box; } .contact-form input::placeholder, .contact-form textarea::placeholder { color: #9ca3af; -webkit-text-fill-color: #9ca3af; opacity: 1; } .contact-form input:focus, .contact-form textarea:focus { border-color: var(--bf-primary-dark); background: #fff; box-shadow: 0 0 0 3px rgba(0, 117, 117, 0, 0.08); } .contact-form textarea { height: 56px; resize: none; line-height: 1.5; } .contact-form .phone-wrapper { display: flex; border: 1.5px solid #e1e5ec; border-radius: 8px; overflow: hidden; background: #f8f9fb; transition: all 0.18s ease; } .contact-form .phone-wrapper:focus-within { border-color: var(--bf-primary-dark); background: #fff; box-shadow: 0 0 0 3px rgba(0, 117, 117, 0, 0.08); } .contact-form .phone-wrapper input { border: none; border-radius: 0; background: transparent; box-shadow: none; flex: 1; min-width: 0; } .contact-form .phone-wrapper input:focus { border: none; box-shadow: none; background: transparent; } .contact-form .submit-btn { width: 100%; padding: 11px 14px; background: linear-gradient(135deg, var(--bf-primary) 0%, var(--bf-primary-dark) 100%); color: #fff; border: none; border-radius: 10px; font-size: 15px; cursor: pointer; transition: all 0.22s ease; margin-top: 10px; position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; gap: 8px; font-weight: 700; } .contact-form .submit-btn::before { content: ""; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(255, 255, 255, 0.15) 0%, transparent 60%); opacity: 0; transition: opacity 0.2s; } .contact-form .submit-btn:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(0, 117, 0, 0.42); } .contact-form .submit-btn:hover::before { opacity: 1; } .contact-form .submit-btn:active { transform: translateY(0); } .contact-form .btn-arrow { font-size: 16px; transition: transform 0.2s; } .contact-form .submit-btn:hover .btn-arrow { transform: translateX(4px); } .contact-form .form-status { margin-top: 10px; font-weight: 700; font-size: 13px; } .contact-form .form-status.success { color: #16a34a; } .contact-form .form-status.error { color: #dc2626; } .contact-form .trust-strip { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 10px; padding-top: 10px; border-top: 1px solid #e8eaed; flex-wrap: wrap; } .contact-form .trust-item { display: flex; align-items: center; gap: 4px; font-size: 11px; color: #878787; font-weight: 600; } .contact-form .trust-item .tick { width: 12px; height: 12px; background: #dcfce7; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .contact-form .trust-item .tick svg { color: #22c55e; } .contact-form .hp-field { display: none !important; } @media (max-width:1400px) { .overlay {  width: 52%;  padding-left: 48px;  padding-right: 34px; }  .overlay h1, .overlay h2 {  font-size: clamp(30px, 3vw, 40px); }  .overlay p {  margin-bottom: 18px; }  .hero-line {  margin-bottom: 18px; }  .contact-form {  max-width: 390px;  right: 82px; } } @media (max-width:1200px) { .overlay {  width: 54%;  padding-left: 42px; }  .overlay h1, .overlay h2 {  font-size: clamp(28px, 3vw, 36px); }  .contact-form {  max-width: 380px;  right: 58px; } } .carousel { position: absolute; inset: 0; z-index: 1; } .carousel-slide { position: absolute; inset: 0; background-size: cover; background-position: center 52%; opacity: 0; transition: opacity 1s ease-in-out; } .carousel-slide.active { opacity: 1; } .carousel::after { content: ""; position: absolute; inset: 0; background: none; pointer-events: none; } @media (max-width: 1024px) { .contact-form {  display: none; }  .bf-hero {  height: clamp(500px, 52vw, 560px);  min-height: 500px; }  .bf-hero::before {  width: 82%;  opacity: 1; }  .overlay {  width: 100%;  padding: 112px 34px 54px;  align-items: center;  background: none; }  .overlay-content {  max-width: 720px; }  .overlay-content.active {  transform: none; }  .overlay h1, .overlay h2 {  max-width: 720px;  font-size: 42px;  line-height: 1.12;  margin-bottom: 16px; }  .overlay p {  max-width: 620px;  font-size: 18px;  line-height: 1.5;  margin-bottom: 20px; }  .portfolio-btn {  min-height: 46px;  padding: 13px 24px; }  .carousel-slide {  background-position: center center; }  .carousel::after {  background: none; } } @media (max-width: 768px) { .overlay h1, .overlay h2 {  font-size: 28px;  line-height: 1.15;  margin-bottom: 12px; }  .overlay p {  font-size: 14px;  line-height: 1.45;  margin-bottom: 16px; } } @media (max-width: 480px) { .overlay h1, .overlay h2 {  font-size: 25px;  line-height: 1.16; }  .overlay p {  font-size: 13px;  line-height: 1.45; } } .hero-line { width: 210px; margin-bottom: 18px; } .portfolio-btn { min-height: 44px; padding: 12px 18px; font-size: 14px; border-radius: 7px; } .portfolio-btn .btn-arrow { margin-left: 10px; font-size: 16px; } @media (max-width: 480px) { .bf-hero {  height: 500px;  min-height: 500px; }  .bf-hero::before {  width: 100%;  opacity: 1;  background: linear-gradient(90deg,
                rgba(0, 0, 0, 0.74) 0%,
                rgba(0, 0, 0, 0.60) 38%,
                rgba(0, 0, 0, 0.30) 68%,
                rgba(0, 0, 0, 0.08) 88%,
                rgba(0, 0, 0, 0) 100%); }  .overlay {  padding: 86px 18px 36px; }  .overlay h1, .overlay h2 {  font-size: 29px;  line-height: 1.16; }  .overlay p {  font-size: 14px;  line-height: 1.45; }  .portfolio-btn {  width: 100%;  max-width: 230px;  justify-content: center;  text-align: center; }  .carousel::after {  background: none; } } @media (max-width: 360px) { .overlay h1, .overlay h2 {  font-size: 26px; }  .overlay p {  font-size: 13px; } }
    }

/* ---- extracted block 4 ---- */
html, body { margin: 0 !important; padding: 0 !important; overflow-x: hidden !important; } /* ===============================
   TOP CLIENTS SECTION
================================ */.top-clients-section { position: relative; left: 50%; width: 100vw; margin-left: -50vw; padding: 38px 0 40px; background: #ffffff; text-align: center; overflow: hidden; box-sizing: border-box; border: none !important; } .top-clients-section * { box-sizing: border-box; } .top-clients-section .container { width: 100%; max-width: none; margin: 0; padding: 0; } /* Badge */.clients-badge { display: inline-block; padding: 6px 17px; margin-bottom: 10px; border: 1px solid rgba(0, 166, 166, 0, 0.55); border-radius: 30px; background: rgba(0, 166, 166, 0, 0.12); color: var(--bf-primary); font-size: 10px; font-weight: 800; letter-spacing: 4px; text-transform: uppercase; } /* Heading */.top-clients-section h2 { margin: 0 0 10px; color: #101012; font-size: 38px; line-height: 1.2; font-weight: 800; } .top-clients-section h2 span { color: var(--bf-primary); } /* Short Description */.top-clients-section p { max-width: 1100px; margin: 0 auto 28px; padding: 0 20px; color: #515462; font-size: 15px; line-height: 25px; font-weight: 500; } /* Slider */.clients-slider { width: 100vw; overflow: hidden; position: relative; } /* Remove side gradients */.clients-slider::before, .clients-slider::after, .clients-marquee::before, .clients-marquee::after { display: none !important; content: none !important; } /* Rows */.clients-row { --logo-gap: 32px; display: flex; align-items: center; gap: var(--logo-gap); width: max-content; margin-bottom: 22px; will-change: transform; transform: translate3d(0, 0, 0); backface-visibility: hidden; } .clients-row:last-child { margin-bottom: 0; } .clients-row.row-one { animation: clientsSlideLeft 42s linear infinite; } .clients-row.row-two { animation: clientsSlideRight 42s linear infinite; } .clients-slider:hover .clients-row { animation-play-state: paused; } /* Logo group */.clients-group { display: flex; align-items: center; gap: var(--logo-gap); flex-shrink: 0; } /* Logo card */.client-logo { flex: 0 0 auto; width: 240px; height: 130px; padding: 8px 12px; background: #ffffff; border: 1px solid #eeeeee; border-radius: 7px; display: flex; align-items: center; justify-content: center; } .client-logo img { width: 100%; height: 100%; object-fit: contain; display: block; filter: none; opacity: 1; } /* Smooth seamless movement */@keyframes clientsSlideLeft{ 0% {  transform: translate3d(0, 0, 0); }  100% {  transform: translate3d(calc(-50% - 16px), 0, 0); } } @keyframes clientsSlideRight{ 0% {  transform: translate3d(calc(-50% - 16px), 0, 0); }  100% {  transform: translate3d(0, 0, 0); } } /* ===============================
   RESPONSIVE
================================ */@media (max-width: 1024px){ .top-clients-section {  padding: 36px 0 38px; }  .top-clients-section h2 {  font-size: 34px; }  .top-clients-section p {  font-size: 14.5px;  line-height: 24px;  margin-bottom: 26px; }  .client-logo {  width: 200px;  height: 108px; } } @media (max-width: 768px){ .top-clients-section {  padding: 34px 0 36px; }  .clients-badge {  font-size: 9px;  letter-spacing: 3px; }  .top-clients-section h2 {  font-size: 30px; }  .top-clients-section p {  font-size: 14px;  line-height: 23px; }  .clients-row {  --logo-gap: 24px;  margin-bottom: 18px; }  .client-logo {  width: 175px;  height: 96px;  padding: 7px 10px; }  .clients-row.row-one, .clients-row.row-two {  animation-duration: 36s; }  @keyframes clientsSlideLeft{  0% {   transform: translate3d(0, 0, 0); }   100% {   transform: translate3d(calc(-50% - 12px), 0, 0); } }  @keyframes clientsSlideRight{  0% {   transform: translate3d(calc(-50% - 12px), 0, 0); }   100% {   transform: translate3d(0, 0, 0); } } } @media (max-width: 480px){ .top-clients-section {  padding: 30px 0 32px; }  .top-clients-section h2 {  font-size: 26px; }  .top-clients-section p {  font-size: 13.5px;  line-height: 22px;  margin-bottom: 24px; }  .client-logo {  width: 150px;  height: 82px;  padding: 6px 8px; } }

/* ---- extracted block 5 ---- */
.touch-image-wrap { width: 100%; height: clamp(560px, 46vw, 650px); overflow: hidden; border-radius: 12px; } .touch-image-col { margin-top: -16px; } .touch-image { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; } .touch-drag-wrap { position: relative; cursor: ew-resize; --split-position: 50%; touch-action: none; user-select: none; } .touch-drag-wrap .touch-image { position: absolute; inset: 0; pointer-events: none; user-select: none; } .touch-drag-overlay { z-index: 2; clip-path: inset(0 calc(100% - var(--split-position)) 0 0); will-change: clip-path; } .touch-drag-handle { position: absolute; top: 0; bottom: 0; left: var(--split-position); width: 2px; background: #fff; z-index: 3; pointer-events: none; transform: translateX(-50%); will-change: left; } @media (max-width: 1199px) { .touch-image-wrap {  height: clamp(500px, 56vw, 600px); } } @media (max-width: 991px) { .touch-image-col {  margin-top: -12px; }  .touch-image-wrap {  height: clamp(460px, 66vw, 560px); } } @media (max-width: 767px) { .touch-image-col {  margin-bottom: -28px; }  .touch-image-wrap {  height: clamp(360px, 78vw, 480px);  border-radius: 10px; } } @media (max-width: 480px) { .touch-image-col {  margin-top: -8px;  margin-bottom: -36px; }  .touch-image-wrap {  height: clamp(300px, 82vw, 390px);  border-radius: 8px; } }

/* ---- extracted block 6 ---- */
.what-build-section { position: relative; padding: 76px 20px 82px; background: linear-gradient(135deg, rgba(7, 12, 31, 0.58), rgba(7, 12, 31, 0.38)),
      url("assets/images/home/latestproject/bfw2.webp") center / cover no-repeat; overflow: hidden; isolation: isolate; } .what-build-section::before { content: ""; position: absolute; inset: 0; z-index: 0; background: linear-gradient(180deg, rgba(7, 12, 31, 0.38), rgba(7, 12, 31, 0.62)),
      rgba(7, 12, 31, 0.22); pointer-events: none; } .what-build-section::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; z-index: 0; height: 42%; background: linear-gradient(180deg, rgba(0, 163, 161, 0), rgba(0, 163, 161, 0.14)); pointer-events: none; } .what-build-wrap { position: relative; z-index: 1; max-width: 1420px; margin: 0 auto; } .what-build-heading { max-width: 980px; margin: 0 auto 36px; text-align: center; } .what-build-heading h2 { margin: 0 0 14px; color: #ffffff; font-size: 38px; line-height: 1.18; font-weight: 800; } .what-build-heading h2 span { color: #27d8d4; } .what-build-heading p { margin: 0; color: rgba(255, 255, 255, 0.86); font-size: 18px; line-height: 1.7; font-weight: 500; } .what-build-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; } .what-build-card { position: relative; display: block; min-height: 340px; border-radius: 8px; overflow: hidden; color: #ffffff; background: #070c1f; box-shadow: 0 18px 42px rgba(7, 12, 31, 0.16); isolation: isolate; } .what-build-card img { width: 100%; height: 100%; min-height: 340px; object-fit: cover; display: block; transform: scale(1.01); transition: transform 500ms ease, filter 500ms ease; } .what-build-card::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(7, 12, 31, 0.08) 25%, rgba(7, 12, 31, 0.78) 100%); transition: background 350ms ease; } .what-build-card::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; height: 54%; background: linear-gradient(180deg, rgba(255, 87, 51, 0), rgba(255, 87, 51, 0.92)); transform: translateY(58%); transition: transform 350ms ease; } .what-build-content { position: absolute; left: 24px; right: 24px; bottom: 24px; z-index: 2; text-align: center; transform: translateY(48px); transition: transform 350ms ease; } .what-build-content h3 { margin: 0 0 16px; color: #ffffff; font-size: 21px; line-height: 1.25; font-weight: 800; text-shadow: 0 8px 22px rgba(0, 0, 0, 0.28); } .what-build-content span { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 12px 26px; border-radius: 8px; background: #00a3a1; color: #ffffff; font-size: 15px; line-height: 1; font-weight: 800; opacity: 0; transform: translateY(12px); transition: opacity 300ms ease, transform 300ms ease, background 300ms ease; } .what-build-card:hover, .what-build-card:focus { color: #ffffff; } .what-build-card:hover img, .what-build-card:focus img { transform: scale(1.08); filter: saturate(1.12) contrast(1.05); } .what-build-card:hover::before, .what-build-card:focus::before { background: linear-gradient(180deg, rgba(7, 12, 31, 0.18) 0%, rgba(7, 12, 31, 0.5) 46%, rgba(7, 12, 31, 0.76) 100%); } .what-build-card:hover::after, .what-build-card:focus::after { transform: translateY(0); } .what-build-card:hover .what-build-content, .what-build-card:focus .what-build-content { transform: translateY(0); } .what-build-card:hover .what-build-content span, .what-build-card:focus .what-build-content span { opacity: 1; transform: translateY(0); } .what-build-card .what-build-content span:hover { background: #27d8d4; color: #070c1f; } @media (max-width: 1199px) { .what-build-grid {  grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 768px) { .what-build-section {  margin-top: 26px;  padding: 52px 16px 58px; }  .what-build-heading {  margin-bottom: 24px; }  .what-build-heading h2 {  font-size: 27px;  line-height: 1.25; }  .what-build-heading p {  font-size: 16px;  line-height: 1.7; }  .what-build-grid {  grid-template-columns: repeat(2, minmax(0, 1fr));  gap: 16px; }  .what-build-card, .what-build-card img {  min-height: 310px; } } @media (max-width: 575px) { .what-build-grid {  grid-template-columns: 1fr;  gap: 18px; } } @media (hover: none) { .what-build-card::after, .what-build-card .what-build-content {  transform: translateY(0); }  .what-build-content span {  opacity: 1;  transform: translateY(0); } }

/* ---- extracted block 7 ---- */
/* ===============================
   AWARD WINNING STANDS SECTION
================================ */.bf-award-section { position: relative; left: 50%; width: 100vw; margin-left: -50vw; padding: 42px 0 48px; background: #ffffff; text-align: center; overflow: hidden; box-sizing: border-box; } .bf-award-section * { box-sizing: border-box; } .bf-award-container { width: 100%; max-width: none; margin: 0; padding: 0 10px; } /* Badge */.bf-award-badge { display: inline-block; padding: 5px 14px; margin-bottom: 8px; border: 1px solid rgba(0, 166, 166, 0, 0.55); border-radius: 30px; background: rgba(0, 166, 166, 0, 0.12); color: var(--bf-primary); font-size: 8px; font-weight: 800; letter-spacing: 2.5px; text-transform: uppercase; } /* Heading */.bf-award-title { margin: 0 0 10px; color: #101012; font-size: 38px; line-height: 1.15; font-weight: 800; } .bf-award-title span { color: var(--bf-primary); } /* Description */.bf-award-desc { max-width: 1180px; margin: 0 auto 30px; padding: 0 20px; color: #515462; font-size: 14px; line-height: 25px; font-weight: 500; } /* Grid - 4 images desktop */.bf-award-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; width: 100%; } /* Card */.bf-award-card { position: relative; width: 100%; aspect-ratio: 4 / 3; overflow: hidden; border-top: 2px solid var(--bf-primary); border-bottom: 2px solid var(--bf-primary); border-left: 1px solid rgba(0, 166, 166, 0.75); border-right: 1px solid rgba(0, 166, 166, 0.75); border-radius: 7px; background: #000; cursor: pointer; } .bf-award-card img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.45s ease; } .bf-award-card:hover img { transform: scale(1.05); } /* Hover black gradient details */.bf-award-overlay { position: absolute; inset: 0; padding: 16px; background: linear-gradient(180deg,
        rgba(0, 0, 0, 0.05) 0%,
        rgba(0, 0, 0, 0.28) 45%,
        rgba(0, 0, 0, 0.82) 100%); display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-end; text-align: right; color: #ffffff; opacity: 0; transition: opacity 0.35s ease; } .bf-award-card:hover .bf-award-overlay { opacity: 1; } .bf-award-overlay h3 { margin: 0 0 5px; font-size: 15px; line-height: 1.2; font-weight: 800; text-transform: uppercase; } .bf-award-overlay p { margin: 0; font-size: 12px; line-height: 1.45; font-weight: 600; } /* Plus Icon */.bf-award-plus { position: absolute; top: 12px; right: 12px; width: 34px; height: 34px; border-radius: 50%; background: #ffffff; color: var(--bf-primary); display: flex; align-items: center; justify-content: center; font-size: 22px; opacity: 0; transform: scale(0.8); transition: 0.3s ease; } .bf-award-card:hover .bf-award-plus { opacity: 1; transform: scale(1); } /* Button */.bf-award-btn-wrap { margin-top: 16px; } .bf-award-btn { display: inline-block; width: 100%; max-width: 520px; padding: 13px 24px; background: var(--bf-primary); color: #ffffff; border-radius: 4px; text-decoration: none; font-size: 14px; font-weight: 700; transition: 0.3s ease; } .bf-award-btn:hover { background: var(--bf-primary-dark); color: #ffffff; } /* Lightbox */.bf-award-lightbox { display: none; position: fixed; inset: 0; z-index: 99999; background: rgba(0, 0, 0, 0.94); align-items: center; justify-content: center; padding: 20px; } .bf-award-lightbox img#bfAwardLightboxImg { max-width: 92%; max-height: 78vh; object-fit: contain; } .bf-award-close { position: absolute; top: 20px; right: 32px; color: #ffffff; font-size: 42px; line-height: 1; cursor: pointer; z-index: 3; } .bf-award-lightbox .bf-lightbox-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; } .bf-award-lightbox .bf-lightbox-prev { left: 24px; } .bf-award-lightbox .bf-lightbox-next { right: 24px; } .bf-award-lightbox .bf-lightbox-thumbs { position: absolute; left: 50%; bottom: 20px; transform: translateX(-50%); max-width: 90vw; } /* ===============================
   RESPONSIVE
================================ */@media (max-width: 1200px) { .bf-award-grid {  grid-template-columns: repeat(3, 1fr); } } @media (max-width: 768px) { .bf-award-section {  padding: 34px 0 40px; }  .bf-award-container {  padding: 0 6px; }  .bf-award-title {  font-size: 30px; }  .bf-award-desc {  font-size: 14px;  line-height: 24px;  margin-bottom: 26px; }  .bf-award-grid {  grid-template-columns: repeat(2, 1fr);  gap: 7px; }  .bf-award-card {  aspect-ratio: 4 / 3; } } @media (max-width: 520px) { .bf-award-section {  padding: 30px 0 36px; }  .bf-award-container {  padding: 0 5px; }  .bf-award-title {  font-size: 26px; }  .bf-award-desc {  font-size: 13.5px;  line-height: 23px;  padding: 0 12px; }  .bf-award-grid {  grid-template-columns: 1fr;  gap: 7px; }  /* Mobile image will not cut */ .bf-award-card {  height: auto;  aspect-ratio: auto; }  .bf-award-card img {  height: auto;  object-fit: contain; }  .bf-award-overlay {  padding: 14px; }  .bf-award-overlay h3 {  font-size: 14px; }  .bf-award-overlay p {  font-size: 12px; }  .bf-award-btn {  max-width: calc(100% - 10px); } }

/* ---- extracted block 8 ---- */
/* =========================================
   TESTIMONIAL SECTION
========================================== */.bf-client-reviews, .bf-client-reviews * { box-sizing: border-box; } .bf-client-reviews { --bf-orange: var(--bf-primary-dark); --bf-orange-dark: #d95310; --bf-black: #171717; --bf-text: #454545; --bf-muted: #707070; --bf-border: #e7e7e7; --bf-light: #f8f8f8; position: relative; overflow: hidden; padding: 58px 20px 52px; background: radial-gradient(
            circle at 50% 0%,
            rgba(0, 166, 166, 34, 0.055),
            transparent 32%
        ),
        #ffffff; font-family: Arial, Helvetica, sans-serif; } .bf-reviews-container { width: 100%; max-width: 1500px; margin: 0 auto; } /* =========================================
   HEADING
========================================== */.bf-reviews-heading { max-width: 820px; margin: 0 auto 24px; text-align: center; } .bf-small-heading { display: inline-flex; align-items: center; gap: 11px; margin-bottom: 11px; color: var(--bf-orange); font-size: 13px; font-weight: 700; line-height: 1.3; letter-spacing: 2px; text-transform: uppercase; } .bf-small-heading span { width: 27px; height: 1px; background: var(--bf-orange); } .bf-reviews-heading h2 { margin: 0; color: var(--bf-black); font-size: clamp(34px, 4vw, 52px); font-weight: 800; line-height: 1.08; letter-spacing: -1.4px; } .bf-reviews-heading p { max-width: 700px; margin: 13px auto 0; color: #5e5e5e; font-size: 16px; line-height: 1.6; } /* =========================================
   SCROLL MESSAGE
========================================== */.bf-scroll-message { display: flex; align-items: center; justify-content: flex-end; gap: 7px; margin: 0 4px 10px; color: #797979; font-size: 12px; line-height: 1.4; } .bf-scroll-icon { color: var(--bf-orange); font-size: 18px; font-weight: 700; } /* =========================================
   HORIZONTAL SCROLL AREA
========================================== */.bf-review-scroll { display: flex; gap: 16px; width: 100%; padding: 4px 4px 20px; overflow-x: auto; overflow-y: hidden; scroll-behavior: smooth; scroll-snap-type: x proximity; overscroll-behavior-inline: contain; scrollbar-width: thin; scrollbar-color: var(--bf-orange) #ededed; -webkit-overflow-scrolling: touch; } .bf-review-scroll::-webkit-scrollbar { height: 7px; } .bf-review-scroll::-webkit-scrollbar-track { background: #ededed; border-radius: 20px; } .bf-review-scroll::-webkit-scrollbar-thumb { background: var(--bf-orange); border-radius: 20px; } .bf-review-scroll::-webkit-scrollbar-thumb:hover { background: var(--bf-orange-dark); } /* =========================================
   REVIEW CARD
========================================== */.bf-review-card { position: relative; flex: 0 0 342px; min-height: 368px; padding: 24px 23px 22px; overflow: hidden; background: #ffffff; border: 1px solid var(--bf-border); border-radius: 12px; box-shadow: 0 7px 23px rgba(0, 0, 0, 0.045); scroll-snap-align: start; transition: transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease; } .bf-review-card::before { content: ""; position: absolute; top: 0; left: 22px; width: 50px; height: 3px; background: var(--bf-orange); border-radius: 0 0 4px 4px; } .bf-review-card:hover { border-color: rgba(0, 166, 166, 34, 0.4); box-shadow: 0 15px 35px rgba(0, 0, 0, 0.085); transform: translateY(-4px); } /* =========================================
   CARD TOP
========================================== */.bf-review-top { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 70px; margin-bottom: 16px; } .bf-logo-box { display: flex; align-items: center; justify-content: center; width: 96px; height: 65px; padding: 9px; overflow: hidden; background: #ffffff; border: 1px solid #e5e5e5; border-radius: 8px; } .bf-logo-box img { display: block; width: 100%; height: 100%; object-fit: contain; } .bf-stars { color: var(--bf-orange); font-size: 17px; line-height: 1; letter-spacing: 1px; white-space: nowrap; } /* =========================================
   QUOTE
========================================== */.bf-quote-mark { position: absolute; top: 85px; right: 19px; color: rgba(0, 166, 166, 34, 0.12); font-family: Georgia, "Times New Roman", serif; font-size: 68px; font-weight: 700; line-height: 1; pointer-events: none; } .bf-review-card blockquote { min-height: 116px; margin: 0 0 19px; padding: 0; color: #343434; font-size: 15px; font-style: normal; font-weight: 400; line-height: 1.7; } /* =========================================
   CLIENT DETAILS
========================================== */.bf-review-author { padding-top: 16px; border-top: 1px solid var(--bf-border); } .bf-review-author h3 { margin: 0 0 4px; color: var(--bf-black); font-size: 17px; font-weight: 750; line-height: 1.3; } .bf-designation { margin: 0 0 5px; color: #666666; font-size: 13px; line-height: 1.4; } .bf-company { margin: 0 0 8px; color: #3d3d3d; font-size: 14px; font-weight: 650; line-height: 1.4; } .bf-event { margin: 0; color: var(--bf-orange); font-size: 13px; font-weight: 700; line-height: 1.45; } .bf-event span { display: block; margin-top: 2px; color: #757575; font-weight: 400; } /* =========================================
   BOTTOM CTA
========================================== */.bf-review-cta { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 27px; padding: 20px 24px; background: var(--bf-light); border: 1px solid #eeeeee; border-radius: 10px; } .bf-cta-text { display: flex; flex-direction: column; gap: 4px; } .bf-cta-text strong { color: var(--bf-black); font-size: 18px; line-height: 1.3; } .bf-cta-text span { color: #656565; font-size: 14px; line-height: 1.5; } .bf-cta-button { display: inline-flex; flex-shrink: 0; align-items: center; justify-content: center; gap: 11px; min-height: 49px; padding: 13px 22px; color: #ffffff; background: var(--bf-orange); border: 1px solid var(--bf-orange); border-radius: 5px; font-size: 13px; font-weight: 750; line-height: 1.3; letter-spacing: 0.5px; text-decoration: none; text-transform: uppercase; transition: background-color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease; } .bf-cta-button span { font-size: 20px; line-height: 1; transition: transform 0.2s ease; } .bf-cta-button:hover { color: #ffffff; background: var(--bf-orange-dark); border-color: var(--bf-orange-dark); transform: translateY(-2px); } .bf-cta-button:hover span { transform: translateX(4px); } /* =========================================
   TABLET
========================================== */@media (max-width: 991px) { .bf-client-reviews {  padding: 50px 16px 44px; }  .bf-review-card {  flex-basis: 320px; }  .bf-review-cta {  align-items: flex-start; } } /* =========================================
   MOBILE
========================================== */@media (max-width: 650px) { .bf-client-reviews {  padding: 42px 12px 38px; }  .bf-reviews-heading {  margin-bottom: 18px; }  .bf-small-heading {  gap: 8px;  font-size: 11px;  letter-spacing: 1.5px; }  .bf-small-heading span {  width: 18px; }  .bf-reviews-heading h2 {  font-size: 33px;  letter-spacing: -0.8px; }  .bf-reviews-heading p {  margin-top: 10px;  font-size: 14px;  line-height: 1.55; }  .bf-scroll-message {  justify-content: center;  margin-bottom: 9px; }  .bf-review-scroll {  gap: 12px;  padding-right: 22px;  padding-bottom: 17px; }  .bf-review-card {  flex-basis: calc(100vw - 44px);  min-height: 355px;  padding: 22px 20px 20px; }  .bf-logo-box {  width: 88px;  height: 60px; }  .bf-stars {  font-size: 15px; }  .bf-review-card blockquote {  min-height: 108px;  font-size: 14px;  line-height: 1.65; }  .bf-review-cta {  flex-direction: column;  align-items: stretch;  gap: 16px;  padding: 18px;  text-align: center; }  .bf-cta-button {  width: 100%; } } /* =========================================
   REDUCED MOTION
========================================== */@media (prefers-reduced-motion: reduce) { .bf-review-scroll {  scroll-behavior: auto; }  .bf-review-card, .bf-cta-button, .bf-cta-button span {  transition: none; } }

/* ---- extracted block 9 ---- */
.expert-services { --service-orange: var(--bf-primary-dark); --service-dark: #070c1f; --service-text: #30333b; --service-border: #e5e7eb; padding: 55px 20px; background: #ffffff; } /* =========================
     Section Heading
  ========================== */.expert-services .services-heading { max-width: 1180px; margin: 0 auto 42px; text-align: center; } .expert-services .services-eyebrow { margin: 0 0 18px; display: flex; align-items: center; justify-content: center; gap: 14px; color: var(--service-orange); font-size: 18px; line-height: 1; font-weight: 800; letter-spacing: 0.5px; text-transform: uppercase; } .expert-services .services-eyebrow::before, .expert-services .services-eyebrow::after { content: ""; width: 34px; height: 2px; display: block; border-radius: 20px; background: var(--service-orange); } .expert-services .services-heading h2 { margin: 0 0 16px; color: var(--service-dark); font-size: clamp(30px, 3vw, 42px); line-height: 1.2; font-weight: 750; letter-spacing: -0.6px; } .expert-services .heading-dark { color: var(--service-dark); } .expert-services .heading-orange { color: var(--service-orange); } .expert-services .services-heading p { max-width: 1030px; margin: 0 auto; color: #333333; font-size: 16px; line-height: 1.7; font-weight: 500; } /* =========================
     Services Grid
  ========================== */.expert-services .services-grid { max-width: 1450px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--service-border); } /* =========================
     Service Card
  ========================== */.expert-services .service-card { min-width: 0; min-height: 220px; padding: 24px 24px 24px 0; display: grid; grid-template-columns: 150px minmax(0, 1fr); align-items: center; gap: 20px; position: relative; background: #ffffff; border-right: 1px solid var(--service-border); border-bottom: 1px solid var(--service-border); overflow: hidden; transition: background-color 0.3s ease,
      box-shadow 0.3s ease; } .expert-services .service-card:nth-child(3n) { border-right: 0; } .expert-services .service-card:hover { z-index: 2; background: #fffaf8; box-shadow: 0 15px 35px rgba(7, 12, 31, 0.08); } /* =========================
     Service Image
  ========================== */.expert-services .service-media { width: 150px; height: 175px; position: relative; overflow: visible; } .expert-services .service-media::after { content: ""; position: absolute; top: 9px; right: 4px; bottom: 9px; width: 2px; border-radius: 20px; background: rgba(255, 87, 51, 0.2); } .expert-services .service-card img { display: block; width: 135px; height: 175px; object-fit: cover; object-position: center; border-radius: 0 14px 14px 0; clip-path: polygon(
      0 0,
      80% 0,
      100% 16%,
      92% 50%,
      100% 84%,
      80% 100%,
      0 100%
    ); transition: transform 0.4s ease,
      filter 0.4s ease; } .expert-services .service-card:hover img { transform: scale(1.035); filter: saturate(1.05); } /* =========================
     Orange Icon
  ========================== */.expert-services .service-icon { width: 54px; height: 54px; position: absolute; top: 50%; right: -7px; z-index: 2; display: grid; place-items: center; color: #ffffff; background: var(--service-orange); border: 4px solid #ffffff; clip-path: polygon(
      25% 7%,
      75% 7%,
      100% 50%,
      75% 93%,
      25% 93%,
      0 50%
    ); transform: translateY(-50%); transition: transform 0.3s ease; } .expert-services .service-card:hover .service-icon { transform: translateY(-50%) scale(1.08); } .expert-services .service-icon svg { width: 25px; height: 25px; display: block; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } /* =========================
     Service Content
  ========================== */.expert-services .service-content { min-width: 0; padding-right: 3px; } .expert-services .service-number { display: block; margin: 0 0 7px; color: var(--service-orange); font-size: 15px; line-height: 1; font-weight: 800; letter-spacing: 1px; } .expert-services .service-tag { display: block; margin: 0 0 12px; padding: 0 35px 0 0; position: relative; color: var(--service-dark); background: transparent; border-radius: 0; font-size: 18px; line-height: 1.35; font-weight: 750; text-align: left; text-decoration: none; transition: color 0.25s ease; } .expert-services .service-tag::before { content: ""; display: block; width: 27px; height: 2px; margin: 0 0 11px; border-radius: 10px; background: var(--service-orange); } .expert-services .service-tag::after { content: "→"; position: absolute; top: 50%; right: 1px; color: var(--service-orange); font-size: 25px; line-height: 1; font-weight: 400; transform: translateY(-50%); transition: transform 0.25s ease; } .expert-services .service-tag:hover, .expert-services .service-tag:focus-visible { color: var(--service-orange); } .expert-services .service-tag:hover::after, .expert-services .service-tag:focus-visible::after { transform: translate(5px, -50%); } .expert-services .service-tag:focus-visible { outline: 2px solid var(--service-orange); outline-offset: 5px; } .expert-services .service-card p { margin: 0; color: var(--service-text); font-size: 14px; line-height: 1.6; font-weight: 500; text-align: left; } /* =========================
     Explore More Button
  ========================== */.expert-services .services-button-wrap { margin-top: 34px; text-align: center; } .expert-services .services-explore-button { min-width: 230px; padding: 14px 24px; display: inline-flex; align-items: center; justify-content: center; gap: 12px; color: #ffffff; background: var(--service-orange); border: 2px solid var(--service-orange); border-radius: 7px; box-shadow: 0 10px 24px rgba(255, 87, 51, 0.2); font-size: 15px; line-height: 1.2; font-weight: 750; text-decoration: none; transition: color 0.3s ease,
      background-color 0.3s ease,
      border-color 0.3s ease,
      box-shadow 0.3s ease,
      transform 0.3s ease; } .expert-services .services-explore-button::after { content: "→"; font-size: 23px; line-height: 1; font-weight: 400; transition: transform 0.3s ease; } .expert-services .services-explore-button:hover { color: #ffffff; background: var(--service-dark); border-color: var(--service-dark); box-shadow: 0 12px 28px rgba(7, 12, 31, 0.2); transform: translateY(-2px); } .expert-services .services-explore-button:hover::after { transform: translateX(5px); } .expert-services .services-explore-button:focus-visible { outline: 3px solid rgba(255, 87, 51, 0.3); outline-offset: 4px; } /* =========================
     Laptop
  ========================== */@media (max-width: 1199px) { .expert-services .service-card {  min-height: 215px;  grid-template-columns: 125px minmax(0, 1fr);  gap: 16px;  padding-right: 18px; }  .expert-services .service-media {  width: 125px;  height: 165px; }  .expert-services .service-card img {  width: 113px;  height: 165px; }  .expert-services .service-icon {  width: 49px;  height: 49px; }  .expert-services .service-icon svg {  width: 22px;  height: 22px; }  .expert-services .service-tag {  font-size: 16px; }  .expert-services .service-card p {  font-size: 13px; } } /* =========================
     Tablet
  ========================== */@media (max-width: 991px) { .expert-services {  padding: 48px 18px; }  .expert-services .services-grid {  grid-template-columns: repeat(2, minmax(0, 1fr)); }  .expert-services .service-card {  border-right: 1px solid var(--service-border); }  .expert-services .service-card:nth-child(3n) {  border-right: 1px solid var(--service-border); }  .expert-services .service-card:nth-child(2n) {  border-right: 0; } } /* =========================
     Mobile
  ========================== */@media (max-width: 640px) { .expert-services {  padding: 40px 15px; }  .expert-services .services-heading {  margin-bottom: 28px; }  .expert-services .services-eyebrow {  margin-bottom: 13px;  gap: 10px;  font-size: 14px; }  .expert-services .services-eyebrow::before, .expert-services .services-eyebrow::after {  width: 24px; }  .expert-services .services-heading h2 {  margin-bottom: 12px;  font-size: 24px;  line-height: 1.3;  letter-spacing: -0.2px; }  .expert-services .services-heading p {  font-size: 13px;  line-height: 1.6; }  .expert-services .services-grid {  grid-template-columns: 1fr;  border: 1px solid var(--service-border);  border-radius: 14px;  overflow: hidden; }  .expert-services .service-card {  min-height: 165px;  grid-template-columns: 108px minmax(0, 1fr);  gap: 14px;  padding: 14px 14px 14px 0;  border-right: 0 !important;  border-bottom: 1px solid var(--service-border); }  .expert-services .service-card:last-child {  border-bottom: 0; }  .expert-services .service-media {  width: 108px;  height: 138px; }  .expert-services .service-media::after {  top: 7px;  bottom: 7px; }  .expert-services .service-card img {  width: 98px;  height: 138px;  border-radius: 0 11px 11px 0; }  .expert-services .service-icon {  width: 42px;  height: 42px;  right: -4px;  border-width: 3px; }  .expert-services .service-icon svg {  width: 19px;  height: 19px; }  .expert-services .service-number {  margin-bottom: 5px;  font-size: 12px; }  .expert-services .service-tag {  margin-bottom: 8px;  padding-right: 24px;  font-size: 15px;  line-height: 1.3; }  .expert-services .service-tag::before {  width: 22px;  margin-bottom: 8px; }  .expert-services .service-tag::after {  font-size: 20px; }  .expert-services .service-card p {  display: -webkit-box;  overflow: hidden;  font-size: 12px;  line-height: 1.5;  -webkit-box-orient: vertical;  -webkit-line-clamp: 3; }  .expert-services .services-button-wrap {  margin-top: 26px; }  .expert-services .services-explore-button {  width: 100%;  max-width: 300px;  min-width: 0;  padding: 13px 20px;  font-size: 14px; } } /* =========================
     Small Mobile
  ========================== */@media (max-width: 390px) { .expert-services .service-card {  grid-template-columns: 94px minmax(0, 1fr);  gap: 12px; }  .expert-services .service-media {  width: 94px;  height: 130px; }  .expert-services .service-card img {  width: 86px;  height: 130px; }  .expert-services .service-icon {  width: 38px;  height: 38px; }  .expert-services .service-tag {  font-size: 14px; }  .expert-services .service-card p {  font-size: 11.5px; } }

/* ---- extracted block 10 ---- */
.booth-process-new { padding: 90px 0; overflow: hidden; } .booth-process-new .section-title { margin-bottom: 45px; } .booth-process-wrapper { display: flex; gap: 8px; width: 100%; height: 420px; overflow: hidden; } .booth-process-card { position: relative; flex: 1; min-width: 90px; height: 100%; border-radius: 10px; overflow: hidden; cursor: pointer; background-size: cover; background-position: center; transition: flex 0.5s ease; } .booth-process-card.active { flex: 4.5; } .booth-process-card::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(
      180deg,
      rgba(0, 0, 0, 0.18) 0%,
      rgba(0, 0, 0, 0.48) 45%,
      rgba(0, 0, 0, 0.88) 100%
    ); } .booth-process-content { position: absolute; left: 30px; right: 30px; bottom: 30px; z-index: 2; color: #fff; } .booth-process-content span { display: block; margin-bottom: 10px; font-size: 32px; line-height: 1; font-weight: 800; color: var(--bf-primary); } .booth-process-content h3 { margin: 0; max-width: 560px; font-size: 26px; line-height: 1.25; font-weight: 700; color: #fff; } .booth-process-content p { max-width: 700px; margin: 12px 0 0; font-size: 16px; line-height: 1.6; color: rgba(255, 255, 255, 0.9); } .booth-process-content a { color: #fff; text-decoration: underline; } .booth-process-card:not(.active) .booth-process-content { left: 0; right: 0; top: 0; bottom: 0; width: 100%; } .booth-process-card:not(.active) .booth-process-content span { position: absolute; top: 24px; left: 50%; margin: 0; transform: translateX(-50%); font-size: 18px; } .booth-process-card:not(.active) .booth-process-content h3 { position: absolute; left: 50%; bottom: 140px; width: 260px; max-width: none; transform: translateX(-50%) rotate(-90deg); transform-origin: center center; text-align: left; font-size: 15px; line-height: 1.2; white-space: nowrap; overflow: visible; color: #fff; } .booth-process-card:not(.active) { overflow: hidden; } .booth-process-card:not(.active) .booth-process-content { overflow: visible; } .booth-process-card:not(.active) .booth-process-content p { display: none; } @media (max-width: 1199px) { .booth-process-wrapper {  height: 400px; }  .booth-process-content h3 {  font-size: 24px; }  .booth-process-content p {  font-size: 15px; } } @media (max-width: 991px) { .booth-process-new {  padding: 70px 0; }  .booth-process-wrapper {  display: grid;  grid-template-columns: 1fr 1fr;  height: auto;  gap: 18px;  overflow: visible; }  .booth-process-card, .booth-process-card.active {  flex: none;  width: 100%;  min-width: 0;  height: 340px; }  .booth-process-card:not(.active) .booth-process-content, .booth-process-content {  left: 24px;  right: 24px;  top: auto;  bottom: 24px;  width: auto; }  .booth-process-card:not(.active) .booth-process-content span {  position: static;  margin-bottom: 10px;  transform: none;  font-size: 28px; }  .booth-process-card:not(.active) .booth-process-content h3 {  position: static;  width: auto;  max-width: 100%;  transform: none;  font-size: 23px;  white-space: normal; }  .booth-process-card:not(.active) .booth-process-content p {  display: block; } } @media (max-width: 767px) { .booth-process-wrapper {  grid-template-columns: 1fr; }  .booth-process-card, .booth-process-card.active {  height: auto;  min-height: 360px; } } @media (max-width: 575px) { .booth-process-new {  padding: 55px 0; }  .booth-process-new .section-title {  margin-bottom: 28px; }  .booth-process-card, .booth-process-card.active {  min-height: 390px; }  .booth-process-content {  left: 20px;  right: 20px;  bottom: 22px; }  .booth-process-content span, .booth-process-card:not(.active) .booth-process-content span {  font-size: 24px; }  .booth-process-content h3, .booth-process-card:not(.active) .booth-process-content h3 {  font-size: 21px; }  .booth-process-content p {  font-size: 15px;  line-height: 1.55; } }

/* ---- extracted block 11 ---- */
.bf-why-choose { --bf-navy: #061a4d; --bf-orange: var(--bf-primary-dark); --bf-text: #243450; --bf-border: #dfe5ed; --bf-light-orange: #fff3e8; --bf-white: #ffffff; position: relative; width: 100%; overflow: hidden; padding: 46px 20px 34px; background: radial-gradient(
        circle at 50% 0%,
        rgba(0, 117, 117, 0, 0.035),
        transparent 35%
      ),
      #ffffff; box-sizing: border-box; font-family: Arial, Helvetica, sans-serif; } .bf-why-choose *, .bf-why-choose *::before, .bf-why-choose *::after { box-sizing: border-box; } .bf-why-container { width: 100%; max-width: 1480px; margin: 0 auto; } /* Heading */.bf-section-heading { max-width: 980px; margin: 0 auto 26px; text-align: center; } .bf-heading-label { display: flex; align-items: center; justify-content: center; gap: 12px; margin-bottom: 11px; color: var(--bf-orange); font-size: 15px; font-weight: 700; line-height: 1.3; letter-spacing: 1.6px; text-transform: uppercase; } .bf-heading-label span { display: block; width: 58px; height: 3px; border-radius: 10px; background: var(--bf-orange); } .bf-section-heading h2 { margin: 0; color: var(--bf-navy); font-size: clamp(32px, 3vw, 52px); font-weight: 800; line-height: 1.12; letter-spacing: -1.3px; } .bf-section-heading > p { max-width: 820px; margin: 15px auto 0; color: var(--bf-text); font-size: 18px; font-weight: 400; line-height: 1.65; } .bf-heading-line { width: 69px; height: 4px; margin: 14px auto 0; border-radius: 20px; background: var(--bf-orange); } /* Grid */.bf-benefits-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } /* Card */.bf-benefit-card { position: relative; display: grid; grid-template-columns: 125px minmax(0, 1fr); min-height: 292px; padding: 26px 25px 24px 18px; overflow: hidden; border: 1px solid var(--bf-border); border-radius: 13px; background: var(--bf-white); box-shadow: 0 6px 24px rgba(6, 26, 77, 0.035); transition: transform 0.3s ease,
      box-shadow 0.3s ease,
      border-color 0.3s ease; } .bf-benefit-card:hover { transform: translateY(-5px); border-color: rgba(0, 117, 117, 0, 0.32); box-shadow: 0 16px 36px rgba(6, 26, 77, 0.1); } /* Icon */.bf-benefit-icon { position: relative; display: flex; align-items: flex-start; justify-content: center; padding-top: 14px; } .bf-benefit-icon::before { content: ""; position: absolute; top: 13px; left: 4px; width: 116px; height: 116px; border-radius: 50%; background: var(--bf-light-orange); z-index: 0; } .bf-benefit-icon img { position: relative; z-index: 1; width: 86px; height: 86px; padding: 7px; object-fit: contain; } /* Card Content */.bf-benefit-content { position: relative; min-width: 0; padding-left: 12px; } .bf-card-number { display: inline-flex; align-items: center; justify-content: center; min-width: 37px; height: 29px; margin-bottom: 9px; padding: 0 8px; border-radius: 5px; background: var(--bf-orange); color: #ffffff; font-size: 16px; font-weight: 800; line-height: 1; } .bf-benefit-content h3 { margin: 0; color: var(--bf-navy); font-size: 22px; font-weight: 800; line-height: 1.18; letter-spacing: -0.35px; } .bf-card-line { width: 36px; height: 3px; margin: 11px 0 12px; border-radius: 20px; background: var(--bf-orange); } .bf-benefit-content p { margin: 0; color: var(--bf-text); font-size: 16px; font-weight: 400; line-height: 1.55; } /* Bottom Decoration */.bf-bottom-decoration { display: flex; align-items: center; justify-content: center; max-width: 470px; margin: 26px auto 0; color: var(--bf-orange); } .bf-bottom-decoration > span { width: 100%; height: 1px; background: rgba(0, 117, 117, 0, 0.65); } .bf-decoration-icon { display: flex; align-items: center; justify-content: center; padding: 0 10px; } /* Tablet */@media (max-width: 1199px) { .bf-why-choose {  padding: 42px 18px 32px; }  .bf-benefits-grid {  grid-template-columns: repeat(2, minmax(0, 1fr)); }  .bf-benefit-card {  min-height: 290px; } } /* Small Tablet */@media (max-width: 767px) { .bf-why-choose {  padding: 36px 14px 28px; }  .bf-section-heading {  margin-bottom: 22px; }  .bf-heading-label {  gap: 8px;  font-size: 12px;  letter-spacing: 1.1px; }  .bf-heading-label span {  width: 35px;  height: 2px; }  .bf-section-heading h2 {  font-size: 32px;  line-height: 1.15;  letter-spacing: -0.7px; }  .bf-section-heading > p {  margin-top: 12px;  font-size: 16px;  line-height: 1.55; }  .bf-benefits-grid {  grid-template-columns: 1fr;  gap: 14px; }  .bf-benefit-card {  grid-template-columns: 100px minmax(0, 1fr);  min-height: auto;  padding: 23px 20px 22px 14px; }  .bf-benefit-icon::before {  top: 10px;  left: 2px;  width: 90px;  height: 90px; }  .bf-benefit-icon img {  width: 68px;  height: 68px; }  .bf-benefit-content {  padding-left: 8px; }  .bf-benefit-content h3 {  font-size: 20px; }  .bf-benefit-content p {  font-size: 15px;  line-height: 1.55; } } /* Mobile */@media (max-width: 479px) { .bf-why-choose {  padding-left: 12px;  padding-right: 12px; }  .bf-section-heading h2 {  font-size: 28px; }  .bf-section-heading > p {  font-size: 15px; }  .bf-benefit-card {  display: block;  padding: 20px 18px 21px; }  .bf-benefit-icon {  justify-content: flex-start;  width: 90px;  height: 90px;  margin-bottom: 10px;  padding: 0; }  .bf-benefit-icon::before {  top: 0;  left: 0;  width: 82px;  height: 82px; }  .bf-benefit-icon img {  width: 67px;  height: 67px;  margin: 8px 0 0 7px; }  .bf-benefit-content {  padding-left: 0; }  .bf-card-number {  position: absolute;  top: -82px;  left: 82px; }  .bf-benefit-content h3 {  font-size: 20px; }  .bf-bottom-decoration {  max-width: 270px;  margin-top: 22px; } }

/* ---- extracted block 12 ---- */
.global-map-section { background-color: #f4f7f9; padding: 60px 20px; width: 100%; font-family: Arial, sans-serif; } .map-wrapper { max-width: 1100px; width: 100%; position: relative; margin: 0 auto; padding: 20px; } .base-map { width: 100%; height: auto; display: block; opacity: 0.85; filter: grayscale(15%); } /* Nokta (Pin) Animasyonu */.pin-dot { position: absolute; width: 14px; height: 14px; background-color: var(--bf-primary); border: 2px solid #ffffff; border-radius: 50%; transform: translate(-50%, -50%); box-shadow: 0 0 0 rgba(0, 166, 166, 0.7); animation: pulse-teal 2s infinite; z-index: 2; } @keyframes pulse-red { 0% {  transform: translate(-50%, -50%) scale(0.95);  box-shadow: 0 0 0 0 rgba(255, 59, 48, 0.7); }  70% {  transform: translate(-50%, -50%) scale(1);  box-shadow: 0 0 0 10px rgba(255, 59, 48, 0); }  100% {  transform: translate(-50%, -50%) scale(0.95);  box-shadow: 0 0 0 0 rgba(255, 59, 48, 0); } } @keyframes pulse-teal { 0% { transform: translate(-50%, -50%) scale(0.95); box-shadow: 0 0 0 0 rgba(0, 166, 166, 0.7); } 70% { transform: translate(-50%, -50%) scale(1); box-shadow: 0 0 0 10px rgba(0, 166, 166, 0); } 100% { transform: translate(-50%, -50%) scale(0.95); box-shadow: 0 0 0 0 rgba(0, 166, 166, 0); } } /* İsim Etiketleri */.pin-label { position: absolute; background-color: var(--bf-dark); color: #ffffff; padding: 5px 10px; border-radius: 6px; font-size: 11px; font-weight: 700; letter-spacing: 0.2px; white-space: nowrap; z-index: 3; pointer-events: none; box-shadow: 0 4px 10px rgba(0,0,0,0.25); } /* İsimlerin birbiriyle çakışmaması için yönlendirmeler */.lbl-top-right { top: -25px; left: 10px; } .lbl-top-left { top: -25px; right: 10px; } .lbl-bottom-right { top: 10px; left: 10px; } .lbl-bottom-left { top: 10px; right: 10px; } .lbl-top { top: -30px; left: -50%; transform: translateX(-50%); } .lbl-right { top: -10px; left: 15px; }

/* ---- extracted block 13 ---- */
.bf-unique-expo-section { width: 100%; padding: 42px 18px; background: #ffffff; font-family: "Poppins", Arial, sans-serif; } .bf-unique-expo-wrap { max-width: 1520px; margin: 0 auto; background: #ffffff; border-radius: 18px; padding: 34px 24px; position: relative; overflow: hidden; box-shadow: none; } .bf-unique-header { position: relative; z-index: 2; text-align: center; max-width: 900px; margin: 0 auto 28px; } .bf-mini-badge { display: inline-block; background: rgba(0, 166, 166, 32, 0.12); color: var(--bf-primary); font-size: 11px; font-weight: 700; padding: 7px 14px; border-radius: 30px; margin-bottom: 11px; letter-spacing: 0.3px; } .bf-unique-header h2 { margin: 0 0 10px; font-size: 36px; line-height: 1.15; font-weight: 800; color: #1f1f1f; } .bf-unique-header h2 span { color: var(--bf-primary); } .bf-unique-header p { margin: 0 auto; max-width: 780px; font-size: 14.5px; line-height: 1.65; color: #666666; } .bf-main-explore-btn { display: inline-flex; align-items: center; justify-content: center; margin-top: 18px; padding: 12px 24px; border-radius: 40px; background: var(--bf-primary); color: #ffffff; font-size: 14px; font-weight: 700; text-decoration: none; box-shadow: 0 10px 24px rgba(0, 166, 166, 32, 0.28); transition: 0.3s ease; } .bf-main-explore-btn:hover { background: #df6f12; color: #ffffff; transform: translateY(-3px); box-shadow: 0 15px 30px rgba(0, 166, 166, 32, 0.36); } .bf-unique-slider-area { position: relative; z-index: 2; padding: 0 52px; } .bf-unique-track { display: flex; gap: 18px; overflow-x: auto; scroll-behavior: smooth; padding: 8px 4px 16px; scrollbar-width: none; } .bf-unique-track::-webkit-scrollbar { display: none; } .bf-unique-card { flex: 0 0 275px; min-height: 345px; background: #ffffff; border-radius: 18px; padding: 16px 16px 15px; box-shadow: 0 10px 28px rgba(0, 0, 0, 0.06); border: 1px solid #eeeeee; position: relative; transition: 0.35s ease; text-align: left; } .bf-unique-card:hover { transform: translateY(-7px); box-shadow: 0 18px 38px rgba(0, 0, 0, 0.12); border-color: rgba(0, 166, 166, 32, 0.4); } .bf-unique-count { position: absolute; top: 14px; right: 14px; width: 31px; height: 31px; background: #fff4e9; color: var(--bf-primary); border-radius: 50%; font-size: 11px; font-weight: 800; display: flex; align-items: center; justify-content: center; } .bf-unique-logo { width: 76px; height: 76px; margin: 8px 0 15px; border-radius: 18px; background: #fffaf5; border: 1px solid var(--bf-primary-light); display: flex; align-items: center; justify-content: center; overflow: hidden; padding: 10px; } .bf-unique-logo img { max-width: 100%; max-height: 44px; object-fit: contain; display: block; } .bf-unique-date { display: inline-block; background: var(--bf-primary); color: #ffffff; font-size: 11px; font-weight: 800; line-height: 1; padding: 7px 11px; border-radius: 30px; margin-bottom: 10px; } .bf-unique-card h3 { margin: 0 0 10px; min-height: 42px; font-size: 17px; line-height: 1.3; font-weight: 800; color: #202020; } .bf-unique-category { display: inline-block; font-size: 11px; line-height: 1.4; color: #7a5a2f; background: #fff6ec; border: 1px solid var(--bf-primary-light); padding: 6px 9px; border-radius: 20px; margin-bottom: 11px; } .bf-unique-location { font-size: 12.5px; line-height: 1.5; color: #5f5f5f; min-height: 58px; margin: 0 0 16px; } .bf-unique-location span { color: var(--bf-primary); margin-right: 4px; } .bf-unique-btn { display: inline-flex; align-items: center; justify-content: center; width: 100%; text-decoration: none; padding: 11px 14px; border-radius: 30px; background: transparent; border: 1px solid var(--bf-primary); color: var(--bf-primary); font-size: 13px; font-weight: 700; transition: 0.3s ease; } .bf-unique-btn:hover { background: var(--bf-primary); color: #ffffff; } .bf-unique-card-note { text-align: center; font-size: 11px; color: #888888; margin-top: 9px; line-height: 1.4; } .bf-unique-arrow { position: absolute; top: 45%; transform: translateY(-50%); width: 44px; height: 44px; border: none; border-radius: 50%; font-size: 20px; cursor: pointer; z-index: 5; transition: 0.3s ease; } .bf-unique-prev { left: 0; background: #ffffff; color: #222222; box-shadow: 0 8px 22px rgba(0, 0, 0, 0.12); } .bf-unique-next { right: 0; background: var(--bf-primary); color: #ffffff; box-shadow: 0 8px 22px rgba(0, 166, 166, 32, 0.28); } .bf-unique-arrow:hover { transform: translateY(-50%) scale(1.08); } .bf-unique-dots { text-align: center; margin-top: 10px; position: relative; z-index: 2; } .bf-unique-dots button { width: 9px; height: 9px; border: none; border-radius: 50%; margin: 0 5px; background: #d6d6d6; cursor: pointer; transition: 0.3s ease; padding: 0; } .bf-unique-dots button.active { width: 24px; border-radius: 30px; background: var(--bf-primary); } @media (max-width: 768px) { .bf-unique-expo-section {  padding: 30px 10px; }  .bf-unique-expo-wrap {  padding: 24px 10px 28px;  border-radius: 14px; }  .bf-unique-header {  margin-bottom: 22px; }  .bf-unique-header h2 {  font-size: 26px; }  .bf-unique-header p {  font-size: 13.5px;  line-height: 1.6; }  .bf-main-explore-btn {  width: 100%;  max-width: 280px; }  .bf-unique-slider-area {  padding: 0; }  .bf-unique-card {  flex: 0 0 265px;  min-height: 340px; }  .bf-unique-arrow {  display: none; } }

/* ---- extracted block 14 ---- */
/* =====================================================
     COMPACT FAQ SECTION
     Dark Image Background + Two-Column Accordion
  ====================================================== */.bf-faq-section { --bf-faq-orange: var(--bf-primary-dark); --bf-faq-dark: #070c1f; --bf-faq-text: #292d35; --bf-faq-muted: #555b65; --bf-faq-border: #e6e7ea; --bf-faq-answer-bg: #fff8f4; position: relative; width: 100%; margin: 0; padding: 45px 20px; overflow: hidden; background-image: linear-gradient(
        90deg,
        rgba(3, 8, 18, 0.96) 0%,
        rgba(3, 8, 18, 0.9) 34%,
        rgba(3, 8, 18, 0.76) 100%
      ),
      url("assets/images/events/faq images.png"); background-size: cover; background-position: center; background-repeat: no-repeat; } .bf-faq-section::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(
        circle at 76% 18%,
        rgba(255, 87, 15, 0.12),
        transparent 32%
      ),
      linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.02),
        rgba(0, 0, 0, 0.3)
      ); } .bf-faq-container { max-width: 1450px; margin: 0 auto; position: relative; z-index: 2; } .bf-faq-layout { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 24px; align-items: start; } /* =====================================================
     LEFT COMPACT PANEL
  ====================================================== */.bf-faq-intro { padding: 28px 26px; color: #ffffff; background: rgba(4, 8, 16, 0.8); border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 14px; backdrop-filter: blur(9px); -webkit-backdrop-filter: blur(9px); box-shadow: 0 18px 42px rgba(0, 0, 0, 0.22); } .bf-faq-eyebrow { margin: 0 0 14px; display: flex; align-items: center; gap: 9px; color: var(--bf-faq-orange); font-size: 12px; line-height: 1.3; font-weight: 800; letter-spacing: 0.5px; text-transform: uppercase; } .bf-faq-eyebrow::before { content: ""; width: 27px; height: 2px; flex: 0 0 auto; border-radius: 20px; background: var(--bf-faq-orange); } .bf-faq-intro h2 { margin: 0 0 13px; color: #ffffff; font-size: clamp(29px, 3vw, 40px); line-height: 1.08; font-weight: 800; letter-spacing: -0.7px; } .bf-faq-intro h2 span { display: block; color: var(--bf-faq-orange); } .bf-faq-intro-description { margin: 0; color: rgba(255, 255, 255, 0.82); font-size: 13px; line-height: 1.65; font-weight: 500; } .bf-faq-intro-divider { width: 35px; height: 2px; margin: 18px 0; border: 0; border-radius: 20px; background: var(--bf-faq-orange); } .bf-faq-benefits { margin: 0; padding: 0; display: grid; gap: 12px; list-style: none; } .bf-faq-benefit { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 10px; align-items: center; } .bf-faq-benefit-icon { width: 34px; height: 34px; display: grid; place-items: center; color: var(--bf-faq-orange); border: 1px solid rgba(255, 87, 15, 0.75); border-radius: 50%; } .bf-faq-benefit-icon svg { width: 17px; height: 17px; display: block; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } .bf-faq-benefit-text { color: rgba(255, 255, 255, 0.9); font-size: 12.5px; line-height: 1.4; font-weight: 600; } /* =====================================================
     TWO-COLUMN FAQ GRID
  ====================================================== */.bf-faq-accordion { min-width: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 12px; align-items: start; } .bf-faq-column { min-width: 0; display: grid; gap: 10px; align-content: start; } .bf-faq-item { min-width: 0; align-self: start; overflow: hidden; background: #ffffff; border: 1px solid rgba(255, 255, 255, 0.7); border-radius: 9px; box-shadow: 0 7px 20px rgba(0, 0, 0, 0.13); transition: border-color 0.25s ease,
      box-shadow 0.25s ease,
      transform 0.25s ease; } .bf-faq-item:hover { border-color: rgba(255, 87, 15, 0.55); box-shadow: 0 10px 24px rgba(0, 0, 0, 0.17); transform: translateY(-1px); } .bf-faq-item.is-open { border-color: var(--bf-faq-orange); } /* =====================================================
     FAQ QUESTION
  ====================================================== */.bf-faq-question { width: 100%; min-height: 58px; padding: 8px 12px 8px 8px; display: grid; grid-template-columns: 40px minmax(0, 1fr) 27px; gap: 11px; align-items: center; color: var(--bf-faq-dark); background: #ffffff; border: 0; cursor: pointer; text-align: left; font: inherit; } .bf-faq-question::before { content: attr(data-faq-number); width: 40px; height: 40px; display: grid; place-items: center; color: #ffffff; background: linear-gradient(
      135deg,
      var(--bf-primary) 0%,
      var(--bf-faq-orange) 100%
    ); border-radius: 7px; box-shadow: 0 5px 13px rgba(255, 87, 15, 0.2); font-size: 12px; line-height: 1; font-weight: 800; } .bf-faq-question-text { min-width: 0; color: var(--bf-faq-dark); font-size: 13.5px; line-height: 1.38; font-weight: 750; } .bf-faq-toggle { width: 27px; height: 27px; position: relative; display: block; border: 1.5px solid var(--bf-faq-orange); border-radius: 50%; transition: background-color 0.25s ease,
      transform 0.25s ease; } .bf-faq-toggle::before, .bf-faq-toggle::after { content: ""; position: absolute; top: 50%; left: 50%; width: 10px; height: 1.5px; border-radius: 10px; background: var(--bf-faq-orange); transform: translate(-50%, -50%); transition: opacity 0.25s ease,
      background-color 0.25s ease,
      transform 0.25s ease; } .bf-faq-toggle::after { transform: translate(-50%, -50%) rotate(90deg); } .bf-faq-item.is-open .bf-faq-toggle { background: var(--bf-faq-orange); transform: rotate(180deg); } .bf-faq-item.is-open .bf-faq-toggle::before { background: #ffffff; } .bf-faq-item.is-open .bf-faq-toggle::after { opacity: 0; } /* =====================================================
     FAQ ANSWER
  ====================================================== */.bf-faq-answer { display: grid; grid-template-rows: 0fr; background: var(--bf-faq-answer-bg); transition: grid-template-rows 0.35s ease; } .bf-faq-item.is-open .bf-faq-answer { grid-template-rows: 1fr; } .bf-faq-answer-inner { min-height: 0; overflow: hidden; } .bf-faq-answer-content { padding: 2px 15px 16px 59px; color: var(--bf-faq-muted); font-size: 12.5px; line-height: 1.65; font-weight: 500; } .bf-faq-answer-content a { color: var(--bf-faq-orange); font-weight: 700; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; transition: color 0.2s ease; } .bf-faq-answer-content a:hover { color: var(--bf-faq-dark); } .bf-faq-question:focus-visible { outline: 3px solid rgba(255, 87, 15, 0.3); outline-offset: -3px; } /* =====================================================
     TABLET
  ====================================================== */@media (max-width: 1050px) { .bf-faq-layout {  grid-template-columns: 250px minmax(0, 1fr);  gap: 18px; }  .bf-faq-intro {  padding: 24px 21px; }  .bf-faq-question-text {  font-size: 12.5px; } } /* =====================================================
     SMALL TABLET
  ====================================================== */@media (max-width: 850px) { .bf-faq-section {  padding: 40px 16px; }  .bf-faq-layout {  grid-template-columns: 1fr;  gap: 18px; }  .bf-faq-intro {  padding: 24px; }  .bf-faq-intro h2 span {  display: inline; }  .bf-faq-benefits {  grid-template-columns: repeat(3, minmax(0, 1fr)); }  .bf-faq-benefit {  grid-template-columns: 30px minmax(0, 1fr); }  .bf-faq-benefit-icon {  width: 30px;  height: 30px; } } /* =====================================================
     MOBILE
  ====================================================== */@media (max-width: 680px) { .bf-faq-section {  padding: 34px 13px; }  .bf-faq-intro {  padding: 22px 19px;  border-radius: 12px; }  .bf-faq-eyebrow {  margin-bottom: 10px;  font-size: 11px; }  .bf-faq-intro h2 {  margin-bottom: 10px;  font-size: 29px; }  .bf-faq-intro-description {  font-size: 12.5px;  line-height: 1.55; }  .bf-faq-intro-divider {  margin: 14px 0; }  .bf-faq-benefits {  display: none; }  .bf-faq-accordion {  grid-template-columns: 1fr;  gap: 8px; }  .bf-faq-question {  min-height: 56px;  grid-template-columns: 38px minmax(0, 1fr) 25px;  gap: 9px;  padding: 8px 10px 8px 8px; }  .bf-faq-question::before {  width: 38px;  height: 38px;  font-size: 11px; }  .bf-faq-question-text {  font-size: 13px; }  .bf-faq-toggle {  width: 25px;  height: 25px; }  .bf-faq-answer-content {  padding: 2px 13px 15px 55px;  font-size: 12px;  line-height: 1.6; } } @media (max-width: 390px) { .bf-faq-section {  padding-right: 10px;  padding-left: 10px; }  .bf-faq-question-text {  font-size: 12.5px; } } @media (prefers-reduced-motion: reduce) { .bf-faq-item, .bf-faq-answer, .bf-faq-toggle, .bf-faq-toggle::before, .bf-faq-toggle::after {  transition: none; } }

/* ---- extracted block 15 ---- */
.bf-footer { position: relative; background: var(--bf-dark); color: #c7cbcd; font-family: Arial, Helvetica, sans-serif; overflow: hidden; padding: 50px 38px 0; } .bf-footer * { box-sizing: border-box; } .bf-footer a { color: #c7cbcd; text-decoration: none; transition: 0.25s ease; } .bf-footer .bf-list a:hover, .bf-footer .bf-contact a:hover, .bf-footer .bf-location a:hover { color: var(--bf-primary-light); } .bf-footer a:hover { color: var(--bf-primary-dark); } .bf-footer-wrap { max-width: 1500px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1.15fr 1.6fr 1fr; gap: 40px; } .bf-footer h3 { margin: 0 0 8px; font-size: 21px; line-height: 1.15; font-weight: 700; color: #ffffff; letter-spacing: 0.2px; } .bf-line { width: 90px; height: 2px; margin-bottom: 17px; background: linear-gradient(to right, var(--bf-primary) 78%, var(--bf-primary-dark) 78%); } .bf-cert-logo img { width: 255px; max-width: 100%; display: block; background: #fff; } .bf-social-title { margin-top: 50px !important; } .bf-sub-title { margin-top: 20px !important; } .bf-social { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; } .bf-social a { width: 37px; height: 37px; border-radius: 50%; color: #fff; font-size: 17px; display: inline-flex; justify-content: center; align-items: center; } .bf-social a:hover { transform: translateY(-3px); color: #fff; } .bf-social .whatsapp { background: #25D366; } .bf-social .facebook { background: #1877F2; } .bf-social .instagram { background: radial-gradient(circle at 30% 30%, #feda75, #d62976, #962fbf, #4f5bd5); } .bf-social .linkedin { background: #0A66C2; } .bf-social .youtube { background: #FF0000; } .bf-list, .bf-contact { padding: 0; margin: 0; list-style: none; } .bf-list li, .bf-contact li { display: flex; align-items: center; gap: 12px; margin-bottom: 9px; font-size: 15px; line-height: 1.32; color: #c7cbcd; } .bf-list span, .bf-contact span { width: 27px; min-width: 27px; height: 27px; border-radius: 50%; background: #006B60; color: #fff; font-size: 11px; display: inline-flex; align-items: center; justify-content: center; } .bf-list li:hover span, .bf-contact li:hover span { background: var(--bf-primary-dark); } .bf-location { display: grid; grid-template-columns: 21px 1fr; gap: 12px; margin-bottom: 16px; } .bf-location>i { color: var(--bf-primary-dark); font-size: 19px; margin-top: 3px; } .bf-location strong { display: block; font-size: 15.8px; margin-bottom: 3px; color: #ffffff; } .bf-location p { margin: 0; font-size: 14.5px; line-height: 1.35; color: #c7cbcd; } .bf-location a { display: block; color: #c7cbcd; text-decoration: none; word-break: normal; overflow-wrap: break-word; } .bf-location a:hover { color: var(--bf-primary-dark); } .bf-contact li { margin-bottom: 16px; } .bf-contact a { font-size: 15px; } .bf-copy { max-width: 1500px; margin: 18px auto 0; padding: 16px 10px; border-top: 1px solid rgba(255,255,255,0.12); text-align: center; font-size: 13.5px; line-height: 1.35; color: #8a9093; } .bf-copy a { color: var(--bf-primary-dark); font-weight: 700; } .bf-copy a:hover { color: #000; } /* Sticky WhatsApp Chat Widget */.bf-chat-widget { position: fixed; right: 24px; bottom: 24px; z-index: 9999; font-family: Arial, Helvetica, sans-serif; } .bf-chat-box { position: absolute; right: 0; bottom: 78px; width: 315px; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; opacity: 0; visibility: hidden; transform: translateY(12px); transition: all 0.3s ease; pointer-events: none; } .bf-chat-box.active { opacity: 1; visibility: visible; transform: translateY(0); pointer-events: auto; } .bf-chat-message { width: 100%; background: #ffffff; color: #222222; padding: 14px 16px; border-radius: 8px; font-size: 14px; line-height: 1.4; box-shadow: 0 8px 25px rgba(0, 0, 0, 0.16); } .bf-chat-option { background: #ffffff; color: #128C7E !important; text-decoration: none; padding: 10px 16px; border-radius: 7px; font-size: 13.5px; line-height: 1.2; box-shadow: 0 8px 22px rgba(0, 0, 0, 0.14); transition: 0.25s ease; text-align: right; } .bf-chat-option:hover { background: #25D366; color: #ffffff !important; transform: translateY(-2px); } .bf-chat-button { position: relative; width: 58px; height: 58px; border: none; outline: none; border-radius: 50%; background: #25D366; color: #ffffff !important; font-size: 30px; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 8px 26px rgba(37, 211, 102, 0.35); transition: 0.25s ease; text-decoration: none; } .bf-chat-button:hover { background: #128C7E; color: #ffffff !important; transform: scale(1.06); } .bf-chat-badge { position: absolute; top: -5px; right: -3px; width: 21px; height: 21px; background: #ff3b30; color: #ffffff; border-radius: 50%; font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; } /* Small pulse effect */.bf-chat-button::after { content: ""; position: absolute; inset: -6px; border-radius: 50%; border: 2px solid rgba(37, 211, 102, 0.45); animation: bfPulse 1.8s infinite; } @keyframes bfPulse { 0% {  transform: scale(0.95);  opacity: 0.8; }  100% {  transform: scale(1.25);  opacity: 0; } } @media (max-width: 767px) { .bf-chat-widget {  right: 16px;  bottom: 18px; }  .bf-chat-box {  width: 270px;  bottom: 72px; }  .bf-chat-button {  width: 54px;  height: 54px;  font-size: 28px; } } /* Floating Call Icon */.custom-call-icon { position: fixed; bottom: 20px; right: 20px; z-index: 1000; transition: transform 0.3s ease; } .custom-call-icon img { width: 50px; height: auto; } .custom-call-icon:hover { transform: scale(1.1); } @media (min-width: 768px) { .custom-call-icon {  display: none; } } @media (max-width: 1200px) { .bf-footer-wrap {  grid-template-columns: repeat(2, 1fr);  gap: 32px 42px; }  .bf-social-title {  margin-top: 32px !important; } } @media (max-width: 768px) { .bf-footer {  padding: 25px 22px 0; }  .bf-footer-wrap {  grid-template-columns: 1fr;  gap: 30px; }  .bf-footer h3 {  font-size: 20px; }  .bf-cert-logo img {  width: 230px; }  .bf-social-title, .bf-sub-title {  margin-top: 24px !important; } } @media (max-width: 480px) { .bf-social a {  width: 35px;  height: 35px;  font-size: 15px; }  .bf-list li, .bf-contact li, .bf-location p {  font-size: 14px; } }

/* ---- extracted block 16 ---- */
/* =========================
   BF PAY LATER - VARIABLES
========================= */:root { --bf-offer-orange: var(--bf-primary-dark); --bf-offer-orange-dark: #e64c00; --bf-offer-navy: #10243d; --bf-offer-text: #1e293b; --bf-offer-muted: #64748b; --bf-offer-border: #e6e9ee; --bf-offer-white: #ffffff; --bf-offer-green: #16803d; } /* =========================
   PAGE OVERLAY
========================= */.bf-enpl-overlay { position: fixed; inset: 0; background: rgba(5, 15, 28, 0.38); z-index: 99997; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.30s ease,
            visibility 0.30s ease; } .bf-enpl-overlay.is-visible { opacity: 1; visibility: visible; pointer-events: auto; } /* =========================
   POPUP PANEL
========================= */.bf-enpl-panel { position: fixed; top: 50%; left: 50%; width: min(440px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); background: var(--bf-offer-white); z-index: 99999; transform: translate(-50%, -48%) scale(.96); transition: opacity 0.28s ease,
            visibility 0.28s ease,
            transform 0.32s cubic-bezier(.22, .8, .26, 1); box-shadow: 0 24px 70px rgba(0, 0, 0, 0.22); font-family: "Poppins",
            "Inter",
            Arial,
            Helvetica,
            sans-serif; display: flex; flex-direction: column; overflow-y: auto; overscroll-behavior: contain; border-radius: 18px; opacity: 0; visibility: hidden; pointer-events: none;  /* Helps browser isolate popup rendering */ contain: layout paint; } .bf-enpl-panel.is-open { opacity: 1; visibility: visible; pointer-events: auto; transform: translate(-50%, -50%) scale(1); } /* =========================
   INNER
========================= */.bf-enpl-inner { width: 100%; padding: 28px 28px 22px; display: flex; flex-direction: column; } /* =========================
   CLOSE BUTTON
========================= */.bf-enpl-close { position: absolute; top: 14px; right: 14px; width: 40px; height: 40px; display: grid; place-items: center; border: 0; background: transparent; color: #253242; cursor: pointer; font-size: 30px; font-weight: 300; line-height: 1; border-radius: 50%; transition: background 0.2s ease,
            transform 0.2s ease; } .bf-enpl-close:hover { background: #f3f4f6; transform: rotate(5deg); } /* =========================
   OFFER BADGE
========================= */.bf-enpl-badge { display: inline-flex; align-items: center; gap: 8px; width: fit-content; padding: 8px 13px; margin: 0 42px 16px 0; border-radius: 100px; background: #fff4ee; color: #a73b00; font-size: 13px; line-height: 1; font-weight: 700; } .bf-enpl-flag { position: relative; width: 20px; height: 14px; display: inline-block; flex: 0 0 20px; overflow: hidden; border: 1px solid rgba(167, 59, 0, 0.18); border-radius: 2px; background: linear-gradient(
                to bottom,
                var(--bf-primary) 0 33.33%,
                #ffffff 33.33% 66.66%,
                #138808 66.66% 100%
            ); } .bf-enpl-flag::after { content: ""; position: absolute; top: 50%; left: 50%; width: 5px; height: 5px; border: 1px solid #000080; border-radius: 50%; transform: translate(-50%, -50%); } /* =========================
   HEADLINE
========================= */.bf-enpl-title { margin: 0 0 9px; color: var(--bf-offer-navy); font-size: 34px; line-height: 1.08; letter-spacing: -1.4px; font-weight: 800; white-space: nowrap; } .bf-enpl-title-highlight { color: var(--bf-offer-orange); } /* =========================
   OFFER LINE
========================= */.bf-enpl-subtitle { margin: 0 0 18px; color: #384354; font-size: 15px; line-height: 1.45; font-weight: 500; } .bf-enpl-subtitle strong { color: var(--bf-offer-navy); font-weight: 800; } /* =========================
   15 / 85 PAYMENT CARD
========================= */.bf-enpl-payment { display: grid; grid-template-columns: 1fr 44px 1fr; align-items: stretch; margin-bottom: 18px; } .bf-enpl-payment-card { min-height: 102px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 16px 10px; border-radius: 9px; overflow: hidden; } .bf-enpl-payment-card:first-child { background: linear-gradient(135deg,
                #f0faf2 0%,
                #e9f7ee 100%); } .bf-enpl-payment-card:last-child { background: linear-gradient(135deg,
                #f1f6fd 0%,
                #edf4fc 100%); } .bf-enpl-percent { margin-bottom: 6px; font-size: 36px; line-height: 1; font-weight: 800; } .bf-enpl-payment-card:first-child .bf-enpl-percent { color: #126b3d; } .bf-enpl-payment-card:last-child .bf-enpl-percent { color: #124b86; } .bf-enpl-pay-label { color: var(--bf-offer-navy); font-size: 12px; line-height: 1.15; font-weight: 800; text-align: center; white-space: nowrap; } .bf-enpl-pay-small { margin-top: 6px; color: #4c5967; font-size: 10px; line-height: 1.2; text-align: center; } /* =========================
   PAYMENT ARROW
========================= */.bf-enpl-payment-arrow { display: flex; justify-content: center; align-items: center; } .bf-enpl-arrow-circle { width: 39px; height: 39px; display: grid; place-items: center; border: 1px solid var(--bf-primary-light); border-radius: 50%; background: #fff; color: var(--bf-offer-navy); font-size: 23px; box-shadow: 0 5px 15px rgba(20,
                35,
                55,
                0.08); } /* =========================
   CTA
========================= */.bf-enpl-cta { width: 100%; min-height: 52px; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 15px 22px; margin-bottom: 14px; border: 0; border-radius: 7px; background: linear-gradient(90deg,
                var(--bf-offer-orange) 0%,
                var(--bf-primary-dark) 100%); color: white; font-size: 16px; line-height: 1; font-weight: 750; text-decoration: none; cursor: pointer; box-shadow: 0 10px 25px rgba(255,
                90,
                10,
                0.22); transition: transform 0.2s ease,
            box-shadow 0.2s ease,
            background 0.2s ease; } .bf-enpl-cta:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 14px 28px rgba(255,
                90,
                10,
                0.30); background: linear-gradient(90deg,
                #e94e00 0%,
                var(--bf-primary-dark) 100%); } .bf-enpl-cta-arrow { font-size: 21px; } /* =========================
   CONTACT DETAILS
========================= */.bf-enpl-contact { display: grid; grid-template-columns: 1fr 1.35fr; gap: 0; margin-top: 0; margin-bottom: 12px; border: 1px solid #e6e9ed; border-radius: 8px; background: #fff; } /* UPDATED:
   Bigger phone + email */.bf-enpl-contact-item { min-height: 54px; display: flex; align-items: center; gap: 9px; padding: 12px 11px; color: #263443; font-size: 12px; line-height: 1.3; font-weight: 600; text-decoration: none; overflow-wrap: anywhere; } .bf-enpl-contact-item:first-child { border-right: 1px solid #e6e9ed; } .bf-enpl-contact-item:hover { color: var(--bf-offer-orange); } /* UPDATED:
   Slightly bigger icon */.bf-enpl-contact-icon { color: var(--bf-offer-navy); font-size: 18px; flex-shrink: 0; } /* =========================
   TERMS
========================= */.bf-enpl-terms { margin: 0; color: #7a838e; font-size: 9px; line-height: 1.5; text-align: center; } /* =========================
   OFFER BUBBLE
========================= */.bf-enpl-bubble { position: fixed; left: 24px; bottom: 24px; z-index: 99996; width: 82px; height: 82px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 5px; border: 2px solid var(--bf-primary-light); border-radius: 50%; background: #fff; color: var(--bf-offer-orange); cursor: pointer; opacity: 0; visibility: hidden; transform: scale(.8); box-shadow: 0 7px 24px rgba(19,
                32,
                45,
                0.16); transition: opacity .25s ease,
            visibility .25s ease,
            transform .25s ease,
            box-shadow .25s ease; font-family: "Poppins",
            Arial,
            sans-serif; } .bf-enpl-bubble.is-visible { opacity: 1; visibility: visible; transform: scale(1); } .bf-enpl-bubble:hover { transform: scale(1.06); box-shadow: 0 11px 29px rgba(255,
                90,
                10,
                0.22); } .bf-enpl-bubble-gift { font-size: 24px; line-height: 1; } .bf-enpl-bubble-text { font-size: 9px; line-height: 1.1; font-weight: 800; text-align: center; } /* Bubble accent ring */.bf-enpl-bubble::after { content: ""; position: absolute; inset: -6px; border: 1px solid rgba(255,
                90,
                10,
                .18); border-radius: inherit; pointer-events: none; } /* =========================
   MOBILE
========================= */@media (max-width: 600px) { .bf-enpl-panel {  width: min(410px,
                    94vw);  border-radius: 15px; }  .bf-enpl-inner {  padding: 24px 18px 18px; }  .bf-enpl-title {  font-size: 27px;  letter-spacing: -1px; }  .bf-enpl-subtitle {  font-size: 14px;  margin-bottom: 20px; }  .bf-enpl-payment-card {  min-height: 92px;  padding: 13px 7px; }  .bf-enpl-percent {  font-size: 30px; }  .bf-enpl-pay-label {  font-size: 10.5px; }  .bf-enpl-pay-small {  font-size: 9px; }  .bf-enpl-payment {  grid-template-columns: 1fr 36px 1fr; }  .bf-enpl-arrow-circle {  width: 33px;  height: 33px;  font-size: 19px; }  .bf-enpl-contact-item {  min-height: 46px;   /* Bigger on mobile too */  font-size: 11px; }  .bf-enpl-bubble {  width: 68px;  height: 68px;  left: 16px;  bottom: 18px; }  .bf-enpl-bubble-gift {  font-size: 20px; }  .bf-enpl-bubble-text {  font-size: 8px; } } /* =========================
   TABLET
========================= */@media (min-width: 601px) and (max-width: 1024px) { .bf-enpl-contact {  margin-top: 12px; } } /* =========================
   SHORT DESKTOP SCREENS
========================= */@media (max-height: 760px) and (min-width: 601px) { .bf-enpl-inner {  padding-top: 26px;  padding-bottom: 18px; }  .bf-enpl-badge {  margin-bottom: 13px; }  .bf-enpl-title {  font-size: 35px; }  .bf-enpl-subtitle {  margin-bottom: 16px;  font-size: 14px; }  .bf-enpl-payment {  margin-bottom: 16px; }  .bf-enpl-payment-card {  min-height: 96px; }  .bf-enpl-percent {  font-size: 35px; }  .bf-enpl-cta {  min-height: 49px; } } /* =========================
   ACCESSIBILITY
========================= */@media (prefers-reduced-motion: reduce) { .bf-enpl-panel, .bf-enpl-overlay, .bf-enpl-bubble {  transition: none; } }

/* ==================== portfolio.html ==================== */

/* ---- portfolio.html block 1 ---- */
#bfSiteHeader .bf-main {
                    height: var(--bf-main-height) !important;
                    min-height: var(--bf-main-height) !important;
                    padding: 0 !important;
                }

                #bfSiteHeader .bf-main-shell {
                    height: var(--bf-main-height) !important;
                    padding-top: 0 !important;
                    padding-bottom: 0 !important;
                }

                .page-sections:empty {
                    display: none !important;
                    height: 0 !important;
                    min-height: 0 !important;
                    margin: 0 !important;
                    padding: 0 !important;
                }

                                html,
                body,
                body > .wrapper {
                    margin-top: 0 !important;
                    padding-top: 0 !important;
                }

                #bfSiteHeader {
                    margin-top: 0 !important;
                    top: 0 !important;
                }

/* ---- portfolio.html block 2 ---- */
:root {
    --pf-orange: var(--bf-primary);
    --pf-orange-dark: #e66400;
    --pf-black: #101010;
    --pf-muted: #6b7280;
    --pf-border: #e9e9e9;
    --pf-bg: #ffffff;
    --pf-soft: #fff7ef;
    --pf-shadow: 0 12px 34px rgba(0,0,0,.08);
}

* { box-sizing: border-box; }
body { background: #fff; }

.bf-portfolio-v2 {
    width: 100%;
    overflow: hidden;
    background: var(--pf-bg);
    color: var(--pf-black);
    font-family: 'Muli', Arial, sans-serif;
}

.bf-hero {
    position: relative;
    width: 100%;
    min-height: clamp(390px, 34vw, 520px);
    display: flex;
    align-items: center;
    padding: clamp(48px, 5vw, 82px) clamp(20px, 6vw, 110px);
    background-image: linear-gradient(90deg, rgba(0,0,0,.90) 0%, rgba(0,0,0,.74) 42%, rgba(0,0,0,.42) 72%, rgba(0,0,0,.18) 100%), url('assets/images/home/latestproject/bfw2.webp');
    background-size: cover;
    background-position: center center;
}

.bf-hero::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 20% 20%, rgba(255,122,0,.20), transparent 32%);
    pointer-events: none;
}

.bf-hero-inner {
    position: relative;
    z-index: 2;
    max-width: 760px;
}

.bf-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border: 1px solid rgba(255,122,0,.45);
    background: rgba(255,122,0,.12);
    border-radius: 999px;
    color: var(--pf-orange);
    font-weight: 800;
    font-size: 14px;
    margin-bottom: 18px;
}

.bf-hero h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(36px, 5vw, 72px);
    line-height: .98;
    letter-spacing: -.03em;
    font-weight: 900;
    font-family: 'Source Sans Pro', Arial, sans-serif;
}

.bf-hero h1 span { color: var(--pf-orange); }

.bf-hero p {
    max-width: 720px;
    color: rgba(255,255,255,.92);
    margin: 24px 0 0;
    font-size: clamp(16px, 1.4vw, 21px);
    line-height: 1.65;
}

.bf-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 32px;
}

.bf-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 52px;
    padding: 14px 24px;
    border-radius: 10px;
    text-decoration: none;
    font-weight: 900;
    transition: .25s ease;
}

.bf-btn-primary {
    background: var(--pf-orange);
    color: #fff;
    border: 1px solid var(--pf-orange);
}
.bf-btn-primary:hover { background: var(--pf-orange-dark); color: #fff; transform: translateY(-2px); }
.bf-btn-outline {
    color: #fff;
    border: 1px solid rgba(255,255,255,.45);
    background: rgba(255,255,255,.04);
}
.bf-btn-outline:hover { border-color: #fff; color: #fff; transform: translateY(-2px); }

.bf-main {
    width: 100%;
    padding: 28px clamp(12px, 2.2vw, 38px) 70px;
}

.bf-filter-panel {
    position: sticky;
    top: 0;
    z-index: 12;
    width: 100%;
    background: rgba(255,255,255,.94);
    backdrop-filter: blur(14px);
    border: 1px solid var(--pf-border);
    box-shadow: 0 12px 30px rgba(0,0,0,.05);
    border-radius: 16px;
    padding: 18px;
    margin-bottom: 28px;
}

.bf-filter-grid {
    display: grid;
    grid-template-columns: 150px 1fr 1fr 1fr 2fr 120px;
    gap: 14px;
    align-items: center;
}

.bf-filter-grid select,
.bf-filter-grid input {
    width: 100%;
    height: 46px;
    border: 1px solid #dedede;
    border-radius: 9px;
    background: #fff;
    color: #111;
    padding: 0 14px;
    font-size: 14px;
    outline: none;
}

.bf-filter-grid select:focus,
.bf-filter-grid input:focus {
    border-color: var(--pf-orange);
    box-shadow: 0 0 0 4px rgba(255,122,0,.12);
}

.bf-all-btn,
.bf-clear-btn {
    height: 46px;
    border-radius: 9px;
    font-weight: 900;
    cursor: pointer;
}

.bf-all-btn {
    border: 1px solid var(--pf-orange);
    background: var(--pf-orange);
    color: #fff;
}

.bf-clear-btn {
    border: 1px solid #dedede;
    background: #fff;
    color: #111;
}

.bf-gallery {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 18px;
    align-items: stretch;
}

.bf-project-card {
    display: none;
    min-width: 0;
    background: #fff;
    border: 1px solid var(--pf-border);
    border-radius: 0;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0,0,0,.06);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    cursor: pointer;
}

.bf-project-card.is-visible { display: block; }
.bf-project-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--pf-shadow);
    border-color: rgba(255,122,0,.38);
}

.bf-card-img {
    position: relative;
    aspect-ratio: 1.44 / 1;
    background: #f3f3f3;
    overflow: hidden;
    border-radius: 0;
}

.bf-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .35s ease;
}
.bf-project-card:hover .bf-card-img img { transform: scale(1.05); }

.bf-year-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    padding: 5px 9px;
    border-radius: 7px;
    background: rgba(0,0,0,.78);
    color: #fff;
    font-size: 11px;
    font-weight: 900;
}

.bf-card-body {
    padding: 16px 16px 14px;
}

.bf-card-body h3 {
    margin: 0 0 6px;
    color: #111;
    font-size: 18px;
    line-height: 1.25;
    font-weight: 900;
    letter-spacing: -.02em;
}

.bf-event {
    margin: 0 0 12px;
    min-height: 20px;
    color: #555;
    font-size: 13px;
    line-height: 1.35;
    font-weight: 700;
}

.bf-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    padding-top: 12px;
    border-top: 1px solid #efefef;
    color: #626262;
    font-size: 12px;
    line-height: 1.35;
}

.bf-meta span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}

.bf-size {
    color: var(--pf-orange-dark);
    font-weight: 900;
}

.bf-load-wrap {
    display: flex;
    justify-content: center;
    margin: 34px 0 18px;
}

.bf-load-more {
    min-width: 240px;
    height: 52px;
    padding: 0 24px;
    border: 1px solid var(--pf-orange);
    background: #fff;
    color: var(--pf-orange-dark);
    border-radius: 0;
    cursor: pointer;
    font-weight: 900;
    transition: .25s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    line-height: 1;
    white-space: nowrap;
    font-family: inherit;
}
.bf-load-more:hover { background: var(--pf-orange); color: #fff; text-decoration: none; }

.bf-no-results {
    display: none;
    text-align: center;
    padding: 46px 20px;
    border: 1px dashed #ddd;
    border-radius: 16px;
    color: #666;
    font-weight: 800;
}


.bf-lightbox-details {
    display: grid;
    gap: 10px;
    margin: 18px 0 22px;
}

.bf-lightbox-row {
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid #eeeeee;
    color: #333;
    font-size: 15px;
    line-height: 1.45;
}

.bf-lightbox-row strong {
    color: #111;
    font-weight: 900;
}

.bf-lightbox-row span {
    color: #555;
    font-weight: 700;
}

.bf-lightbox-row.is-hidden { display: none; }


.bf-cta-strip {
    margin-top: 48px;
    width: 100%;
    border-radius: 18px;
    overflow: hidden;
    background: linear-gradient(120deg, #111 0%, #231500 52%, var(--pf-orange) 100%);
    color: #fff;
    padding: clamp(26px, 4vw, 56px);
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 24px;
    align-items: center;
}

.bf-cta-strip h2 {
    margin: 0 0 10px;
    color: #fff;
    font-size: clamp(28px, 3vw, 48px);
    line-height: 1.05;
    font-weight: 900;
    font-family: 'Source Sans Pro', Arial, sans-serif;
}
.bf-cta-strip h2 span { color: var(--bf-primary-light); }
.bf-cta-strip p { margin: 0; color: rgba(255,255,255,.88); font-size: 17px; line-height: 1.6; }
.bf-cta-actions { display: flex; justify-content: flex-end; gap: 14px; flex-wrap: wrap; }
.bf-cta-actions .bf-btn { background: #fff; color: #111; border: 1px solid #fff; }
.bf-cta-actions .bf-btn:hover { transform: translateY(-2px); }

.bf-lightbox {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 99999;
    background: rgba(0,0,0,.9);
    align-items: center;
    justify-content: center;
    padding: 24px;
}
.bf-lightbox.is-open { display: flex; }
.bf-lightbox-card {
    width: min(1160px, 94vw);
    background: #fff;
    border-radius: 18px;
    overflow: hidden;
    display: grid;
    grid-template-columns: 1.4fr .6fr;
    max-height: 88vh;
}
.bf-lightbox-img { background: #111; min-height: 420px; position: relative; display: flex; flex-direction: column; }
.bf-lightbox-img img#bfLightboxImg { width: 100%; flex: 1 1 auto; min-height: 0; object-fit: contain; display: block; }
.bf-lightbox-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.35);
    background: rgba(0,0,0,.45);
    color: #fff;
    font-size: 26px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.bf-lightbox-arrow:hover { background: var(--bf-primary); border-color: var(--bf-primary); }
.bf-lightbox-prev { left: 16px; }
.bf-lightbox-next { right: 16px; }
.bf-lightbox-thumbs {
    flex: 0 0 auto;
    display: flex;
    gap: 8px;
    padding: 10px;
    overflow-x: auto;
    background: rgba(0,0,0,.55);
}
.bf-lightbox-thumb {
    flex: 0 0 auto;
    width: 64px;
    height: 64px;
    padding: 0;
    border-radius: 8px;
    border: 2px solid transparent;
    overflow: hidden;
    cursor: pointer;
    background: none;
    opacity: .6;
}
.bf-lightbox-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bf-lightbox-thumb.is-active { border-color: var(--bf-primary); opacity: 1; }
.bf-lightbox-thumb:hover { opacity: 1; }
.bf-lightbox-info { padding: 28px; overflow: auto; }
.bf-lightbox-info h3 { margin: 0 0 10px; font-size: 32px; font-weight: 900; color: #111; }
.bf-lightbox-info p { margin: 0 0 14px; color: #555; line-height: 1.6; }
.bf-lightbox-close {
    position: absolute;
    top: 18px;
    right: 22px;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.35);
    background: rgba(0,0,0,.45);
    color: #fff;
    font-size: 28px;
    cursor: pointer;
}

.bf-img-fallback {
    position: absolute;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 16px;
    background: linear-gradient(135deg, #f7f7f7, #fff0df);
    color: #111;
    font-weight: 900;
}

@media (max-width: 1500px) {
    .bf-card-body { padding: 14px 14px 13px; }
    .bf-card-body h3 { font-size: 16px; }
    .bf-event { font-size: 12.5px; }
}

@media (max-width: 1280px) {
    .bf-gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 1200px) {
    .bf-filter-grid { grid-template-columns: repeat(3, 1fr); }
    .bf-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
    .bf-lightbox-card { grid-template-columns: 1fr; overflow: auto; }
    .bf-lightbox-img { min-height: 300px; }
}

@media (max-width: 900px) {
    .bf-hero {
        min-height: auto;
        padding: 48px 20px 54px;
        background-position: center top;
        background-image: linear-gradient(90deg, rgba(0,0,0,.92) 0%, rgba(0,0,0,.80) 58%, rgba(0,0,0,.48) 100%), url('assets/images/home/latestproject/bfw2.webp');
    }
    .bf-main { padding: 22px 14px 56px; }
    .bf-filter-panel { position: relative; top: auto; }
    .bf-filter-grid { grid-template-columns: 1fr 1fr; }
    .bf-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
    .bf-cta-strip { grid-template-columns: 1fr; }
    .bf-cta-actions { justify-content: flex-start; }
}

@media (max-width: 560px) {
    .bf-hero {
        padding: 38px 16px 44px;
        background-position: center top;
    }
    .bf-eyebrow { font-size: 12px; padding: 7px 12px; margin-bottom: 14px; }
    .bf-hero h1 { font-size: 42px; line-height: 1.03; }
    .bf-hero p { font-size: 15px; line-height: 1.55; margin-top: 16px; }
    .bf-hero-actions { flex-direction: column; align-items: stretch; margin-top: 22px; }
    .bf-filter-grid { grid-template-columns: 1fr; }
    .bf-gallery { grid-template-columns: 1fr; }
    .bf-card-img { aspect-ratio: 1.55 / 1; }
    .bf-lightbox { padding: 12px; }
    .bf-lightbox-info h3 { font-size: 25px; }
}


/* ===== FINAL HERO MOBILE OVERLAP + CUT FIX ===== */

/* desktop safe spacing */
.bf-portfolio-v2 {
    width: 100% !important;
    overflow: hidden !important;
    clear: both !important;
}

/* desktop hero */
.bf-hero {
    min-height: 500px !important;
    padding-top: 90px !important;
    padding-bottom: 90px !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}

/* tablet */
@media (max-width: 900px) {
    .bf-hero {
        min-height: auto !important;
        padding: 70px 18px 65px !important;
        background-position: center center !important;
        align-items: flex-start !important;
    }

    .bf-hero-inner {
        max-width: 100% !important;
        width: 100% !important;
    }

    .bf-hero h1 {
        font-size: 46px !important;
        line-height: 1.08 !important;
    }

    .bf-hero p {
        font-size: 17px !important;
        line-height: 1.6 !important;
        max-width: 100% !important;
    }
}

/* mobile final fix */
@media (max-width: 560px) {
    .bf-hero {
        min-height: auto !important;

        /* IMPORTANT: header ke niche content lane ke liye */
        padding-top: 115px !important;

        padding-left: 10px !important;
        padding-right: 10px !important;
        padding-bottom: 42px !important;

        background-size: cover !important;
        background-position: center center !important;
        display: flex !important;
        align-items: flex-start !important;
    }

    .bf-eyebrow {
        font-size: 12px !important;
        padding: 6px 12px !important;
        margin-bottom: 16px !important;
        max-width: 100% !important;
        white-space: normal !important;
        line-height: 1.3 !important;
    }

    .bf-hero h1 {
        font-size: 38px !important;
        line-height: 1.1 !important;
        letter-spacing: -1px !important;
        margin: 0 !important;
    }

    .bf-hero p {
        font-size: 16px !important;
        line-height: 1.55 !important;
        margin-top: 18px !important;
        margin-bottom: 0 !important;
    }

    .bf-hero-actions {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 14px !important;
        margin-top: 24px !important;
    }

    .bf-hero-actions .bf-btn {
        width: 100% !important;
        min-height: 52px !important;
        padding: 14px 18px !important;
        text-align: center !important;
        border-radius: 10px !important;
    }
}

/* small phones */
@media (max-width: 380px) {
    .bf-hero {
        padding-top: 110px !important;
        padding-bottom: 38px !important;
    }

    .bf-hero h1 {
        font-size: 34px !important;
    }

    .bf-hero p {
        font-size: 15px !important;
    }
}

/* ===== CTA BUTTONS MOBILE SINGLE LINE FIX ===== */

@media (max-width: 560px) {
    .bf-cta-strip {
        padding: 26px 18px !important;
        border-radius: 16px !important;
    }

    .bf-cta-actions {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 10px !important;
        width: 100% !important;
        justify-content: unset !important;
        align-items: center !important;
        margin-top: 18px !important;
    }

    .bf-cta-actions .bf-btn {
        width: 100% !important;
        min-height: 48px !important;
        padding: 12px 8px !important;
        font-size: 13px !important;
        line-height: 1.2 !important;
        border-radius: 8px !important;
        white-space: nowrap !important;
        text-align: center !important;
    }
}

@media (max-width: 380px) {
    .bf-cta-actions .bf-btn {
        font-size: 12px !important;
        padding: 11px 6px !important;
    }
}

/* HERO HEADING + DESCRIPTION SIZE FIX */
.bf-hero h1 {
    font-size: clamp(34px, 3.8vw, 54px) !important;
    line-height: 1.06 !important;
}

.bf-hero p {
    font-size: 16px !important;
    line-height: 1.45 !important;
    max-width: 650px !important;
    margin-top: 16px !important;
}

@media (max-width: 560px) {
    .bf-hero h1 {
        font-size: 30px !important;
        line-height: 1.08 !important;
    }

    .bf-hero p {
        font-size: 14px !important;
        line-height: 1.42 !important;
        margin-top: 12px !important;
    }
}

/* ---- portfolio.html block 3 ---- */
.bf-footer {
    position: relative;
    background: var(--bf-dark);
    color: #c7cbcd;
    font-family: Arial, Helvetica, sans-serif;
    overflow: hidden;
    padding: 24px 38px 0;
  }

  .bf-footer * {
    box-sizing: border-box;
  }

  .bf-footer a {
    color: #c7cbcd;
    text-decoration: none;
    transition: 0.25s ease;
  }

  .bf-footer a:hover {
    color: var(--bf-primary-dark);
  }

  .bf-footer-wrap {
    max-width: 1500px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1.15fr 1.6fr 1fr;
    gap: 40px;
  }

  .bf-footer h3 {
    margin: 0 0 8px;
    font-size: 21px;
    line-height: 1.15;
    font-weight: 700;
    color: #c7cbcd;
    letter-spacing: 0.2px;
  }

  .bf-line {
    width: 90px;
    height: 2px;
    margin-bottom: 17px;
    background: linear-gradient(to right, #006B60 78%, var(--bf-primary-dark) 78%);
  }

  .bf-cert-logo img {
    width: 255px;
    max-width: 100%;
    display: block;
    background: #fff;
  }

  .bf-social-title {
    margin-top: 50px !important;
  }

  .bf-sub-title {
    margin-top: 20px !important;
  }

  .bf-social {
    display: flex;
    gap: 14px;
    align-items: center;
    flex-wrap: wrap;
  }

  .bf-social a {
    width: 37px;
    height: 37px;
    border-radius: 50%;
    color: #fff;
    font-size: 17px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
  }

  .bf-social a:hover {
    transform: translateY(-3px);
    color: #fff;
  }

  .bf-social .whatsapp {
    background: #25D366;
  }

  .bf-social .facebook {
    background: #1877F2;
  }

  .bf-social .instagram {
    background: radial-gradient(circle at 30% 30%, #feda75, #d62976, #962fbf, #4f5bd5);
  }

  .bf-social .linkedin {
    background: #0A66C2;
  }

  .bf-social .youtube {
    background: #FF0000;
  }

  .bf-list,
  .bf-contact {
    padding: 0;
    margin: 0;
    list-style: none;
  }

  .bf-list li,
  .bf-contact li {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 9px;
    font-size: 15px;
    line-height: 1.32;
    color: #c7cbcd;
  }

  .bf-list span,
  .bf-contact span {
    width: 27px;
    min-width: 27px;
    height: 27px;
    border-radius: 50%;
    background: #006B60;
    color: #fff;
    font-size: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .bf-list li:hover span,
  .bf-contact li:hover span {
    background: var(--bf-primary-dark);
  }

  .bf-location {
    display: grid;
    grid-template-columns: 21px 1fr;
    gap: 12px;
    margin-bottom: 16px;
  }

  .bf-location>i {
    color: var(--bf-primary-dark);
    font-size: 19px;
    margin-top: 3px;
  }

  .bf-location strong {
    display: block;
    font-size: 15.8px;
    margin-bottom: 3px;
    color: #c7cbcd;
  }

  .bf-location p {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.35;
    color: #c7cbcd;
  }

  .bf-location a {
    display: block;
    color: #c7cbcd;
    text-decoration: none;
    word-break: normal;
    overflow-wrap: break-word;
  }

  .bf-location a:hover {
    color: var(--bf-primary-dark);
  }

  .bf-contact li {
    margin-bottom: 16px;
  }

  .bf-contact a {
    font-size: 15px;
  }

  .bf-copy {
    max-width: 1500px;
    margin: 18px auto 0;
    padding: 12px 10px;
    border-top: 1px solid rgba(0, 107, 96, 0.60);
    text-align: center;
    font-size: 14.5px;
    line-height: 1.35;
    color: #c7cbcd;
  }

  .bf-copy a {
    color: var(--bf-primary-dark);
    font-weight: 700;
  }

  .bf-copy a:hover {
    color: #000;
  }

  /* Sticky WhatsApp Chat Widget */
  .bf-chat-widget {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 9999;
    font-family: Arial, Helvetica, sans-serif;
  }

  .bf-chat-box {
    position: absolute;
    right: 0;
    bottom: 78px;
    width: 315px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition: all 0.3s ease;
    pointer-events: none;
  }

  .bf-chat-box.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
  }

  .bf-chat-message {
    width: 100%;
    background: #ffffff;
    color: #222222;
    padding: 14px 16px;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.4;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.16);
  }

  .bf-chat-option {
    background: #ffffff;
    color: #128C7E !important;
    text-decoration: none;
    padding: 10px 16px;
    border-radius: 7px;
    font-size: 13.5px;
    line-height: 1.2;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.14);
    transition: 0.25s ease;
    text-align: right;
  }

  .bf-chat-option:hover {
    background: #25D366;
    color: #ffffff !important;
    transform: translateY(-2px);
  }

  .bf-chat-button {
    position: relative;
    width: 58px;
    height: 58px;
    border: none;
    outline: none;
    border-radius: 50%;
    background: #25D366;
    color: #ffffff !important;
    font-size: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 8px 26px rgba(37, 211, 102, 0.35);
    transition: 0.25s ease;
    text-decoration: none;
  }

  .bf-chat-button:hover {
    background: #128C7E;
    color: #ffffff !important;
    transform: scale(1.06);
  }

  .bf-chat-badge {
    position: absolute;
    top: -5px;
    right: -3px;
    width: 21px;
    height: 21px;
    background: #ff3b30;
    color: #ffffff;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* Small pulse effect */
  .bf-chat-button::after {
    content: "";
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    border: 2px solid rgba(37, 211, 102, 0.45);
    animation: bfPulse 1.8s infinite;
  }

  @keyframes bfPulse {
    0% {
      transform: scale(0.95);
      opacity: 0.8;
    }

    100% {
      transform: scale(1.25);
      opacity: 0;
    }
  }

  @media (max-width: 767px) {
    .bf-chat-widget {
      right: 16px;
      bottom: 18px;
    }

    .bf-chat-box {
      width: 270px;
      bottom: 72px;
    }

    .bf-chat-button {
      width: 54px;
      height: 54px;
      font-size: 28px;
    }
  }

  /* Floating Call Icon */
  .custom-call-icon {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
    transition: transform 0.3s ease;
  }

  .custom-call-icon img {
    width: 50px;
    height: auto;
  }

  .custom-call-icon:hover {
    transform: scale(1.1);
  }

  @media (min-width: 768px) {
    .custom-call-icon {
      display: none;
    }
  }

  @media (max-width: 1200px) {
    .bf-footer-wrap {
      grid-template-columns: repeat(2, 1fr);
      gap: 32px 42px;
    }

    .bf-social-title {
      margin-top: 32px !important;
    }
  }

  @media (max-width: 768px) {
    .bf-footer {
      padding: 25px 22px 0;
    }

    .bf-footer-wrap {
      grid-template-columns: 1fr;
      gap: 30px;
    }

    .bf-footer h3 {
      font-size: 20px;
    }

    .bf-cert-logo img {
      width: 230px;
    }

    .bf-social-title,
    .bf-sub-title {
      margin-top: 24px !important;
    }

  }

  @media (max-width: 480px) {
    .bf-social a {
      width: 35px;
      height: 35px;
      font-size: 15px;
    }

    .bf-list li,
    .bf-contact li,
    .bf-location p {
      font-size: 14px;
    }

  }
/* ==================== Team / Staff section ==================== */
.bf-team-section { width: 100%; padding: 60px 20px; text-align: center; background: #fff; }
.bf-team-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 30px; margin-top: 34px; max-width: 1200px; margin-left: auto; margin-right: auto; }
.bf-team-card { width: 190px; }
.bf-team-photo { position: relative; width: 190px; height: 190px; border-radius: 14px; overflow: hidden; background: #f0f0f0; }
.bf-team-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bf-team-overlay { position: absolute; inset: 0; background: rgba(17, 17, 17, 0.6); display: flex; align-items: center; justify-content: center; gap: 14px; opacity: 0; transition: opacity 0.25s ease; }
.bf-team-photo:hover .bf-team-overlay { opacity: 1; }
.bf-team-overlay a { width: 42px; height: 42px; border-radius: 50%; background: var(--bf-primary); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 17px; text-decoration: none; transition: transform 0.2s ease; }
.bf-team-overlay a:hover { transform: scale(1.1); background: var(--bf-primary-dark); }
.bf-team-name { margin-top: 14px; font-weight: 700; font-size: 15px; color: var(--bf-dark); }


/* ==================== contact.html ==================== */

/* ---- contact.html block 1 ---- */
#bfSiteHeader .bf-main {
                    height: var(--bf-main-height) !important;
                    min-height: var(--bf-main-height) !important;
                    padding: 0 !important;
                }

                #bfSiteHeader .bf-main-shell {
                    height: var(--bf-main-height) !important;
                    padding-top: 0 !important;
                    padding-bottom: 0 !important;
                }

                .page-sections:empty {
                    display: none !important;
                    height: 0 !important;
                    min-height: 0 !important;
                    margin: 0 !important;
                    padding: 0 !important;
                }

/* ---- contact.html block 2 ---- */
.bf-modern-contact {
    --bf-black: #0a0a0a;
    --bf-white: #ffffff;
    --bf-brand-blue: var(--bf-primary);
    --bf-brand-light-blue: var(--bf-primary);
    --bf-accent: var(--bf-primary);
    --bf-gray-100: #f6f6f6;
    --bf-gray-200: #e5e5e5;
    --bf-gray-400: #8a8a8a;
    --bf-gray-600: #585858;
    --bf-text: #111111;
    --bf-radius: 12px;
    --bf-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
    --bf-shadow-lg: 0 12px 48px rgba(0, 0, 0, 0.14);
    color: var(--bf-text);
    background: var(--bf-white);
    font-family: Helvetica, Roboto, Arial, sans-serif;
    line-height: 1.5;
  }

  .bf-modern-contact *,
  .bf-modern-contact *::before,
  .bf-modern-contact *::after {
    box-sizing: border-box;
  }

  .bf-modern-contact a {
    text-decoration: none;
  }

  .bf-modern-contact .form-section {
    background: var(--bf-white);
    padding: 40px 25px 80px;
    max-width: 1320px;
    margin: 0 auto;
    position: relative;
    z-index: 10;
  }

  .bf-modern-contact .form-layout {
    display: grid;
    grid-template-columns: 420px 1fr;
    border-radius: 20px;
    box-shadow: var(--bf-shadow-lg);
    border: 1px solid var(--bf-gray-200);
    overflow: hidden;
  }

  .bf-modern-contact .contact-info-panel {
    background: linear-gradient(160deg, #111111 0%, #2b2b2b 100%);
    padding: 60px 35px;
    position: relative;
    overflow: hidden;
  }

  .bf-modern-contact .contact-info-panel::after,
  .bf-modern-contact .contact-info-panel::before {
    content: "";
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
  }

  .bf-modern-contact .contact-info-panel::after {
    bottom: -60px;
    right: -60px;
    width: 220px;
    height: 220px;
    background: rgba(255, 255, 255, 0.04);
  }

  .bf-modern-contact .contact-info-panel::before {
    top: -40px;
    left: -40px;
    width: 160px;
    height: 160px;
    background: rgba(0, 117, 117, 0.12);
  }

  .bf-modern-contact .info-label,
  .bf-modern-contact .social-label {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--bf-accent);
  }

  .bf-modern-contact .info-label {
    margin-bottom: 10px;
  }

  .bf-modern-contact .info-heading {
    font-family: Helvetica, Roboto, Arial, sans-serif;
    font-size: 26px;
    font-weight: 700;
    color: #fff;
    line-height: 1.18;
    margin: 0 0 28px;
  }

  .bf-modern-contact .info-block {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 30px;
  }

  .bf-modern-contact .info-item {
    display: flex;
    gap: 14px;
    align-items: flex-start;
  }

  .bf-modern-contact .info-icon {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    color: var(--bf-accent);
  }

  .bf-modern-contact .info-content .title {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.5);
    margin-bottom: 3px;
  }

  .bf-modern-contact .info-content a,
  .bf-modern-contact .info-content p {
    font-size: 15px;
    color: rgba(255, 255, 255, 0.9);
    line-height: 1.5;
    margin: 0;
    display: block;
  }

  .bf-modern-contact .info-content a:hover {
    color: var(--bf-accent);
  }

  .bf-modern-contact .divider-line {
    border: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    margin: 0px 0 12px;
  }

  .bf-modern-contact .social-label {
    color: rgba(255, 255, 255, 0.45);
    margin-bottom: 16px;
  }

  .bf-modern-contact .social-links {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    padding: 0;
    margin: 0;
  }

  .bf-modern-contact .social-link {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255, 255, 255, 0.8);
    transition: background 0.2s, transform 0.2s, border-color 0.2s;
  }

  .bf-modern-contact .social-link:hover {
    background: var(--bf-accent);
    border-color: var(--bf-accent);
    color: #fff;
    transform: translateY(-2px);
  }

  .bf-modern-contact .form-card {
    background: var(--bf-white);
    padding: 40px 55px;
  }

  .bf-modern-contact .form-card h2 {
    font-family: Helvetica, Roboto, Arial, sans-serif;
    font-size: 32px;
    font-weight: 800;
    color: var(--bf-text);
    line-height: 1.18;
    margin: 0 0 8px;
  }

  .bf-modern-contact .form-card .sub {
    color: var(--bf-gray-600);
    font-size: 16px;
    margin: 0 0 32px;
  }

  .bf-modern-contact .form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }

  .bf-modern-contact .form-group {
    display: flex;
    flex-direction: column;
    gap: 7px;
  }

  .bf-modern-contact .form-group.full {
    grid-column: 1 / -1;
  }

  .bf-modern-contact .form-group label {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.4px;
    color: var(--bf-text);
    text-transform: uppercase;
  }

  .bf-modern-contact .form-group input,
  .bf-modern-contact .form-group select,
  .bf-modern-contact .form-group textarea {
    padding: 14px 18px;
    border: 1.5px solid var(--bf-gray-200);
    border-radius: var(--bf-radius);
    font-family: Helvetica, Roboto, Arial, sans-serif;
    font-size: 15px;
    color: var(--bf-text);
    background: var(--bf-gray-100);
    transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
    outline: none;
    width: 100%;
  }

  .bf-modern-contact .form-group input:focus,
  .bf-modern-contact .form-group select:focus,
  .bf-modern-contact .form-group textarea:focus {
    border-color: var(--bf-brand-light-blue);
    box-shadow: 0 0 0 3px rgba(0, 117, 117, 0.14);
    background: var(--bf-white);
  }

  .bf-modern-contact .form-group textarea {
    min-height: 110px;
    resize: vertical;
  }

  .bf-modern-contact .submit-row {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 28px;
    flex-wrap: wrap;
  }

  .bf-modern-contact .btn-submit {
    background: linear-gradient(135deg, var(--bf-brand-blue), var(--bf-brand-light-blue));
    color: #fff;
    border: 0;
    padding: 16px 44px;
    border-radius: 50px;
    font-family: Helvetica, Roboto, Arial, sans-serif;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    letter-spacing: 0;
    transition: transform 0.2s, box-shadow 0.2s;
    box-shadow: 0 6px 24px rgba(0, 117, 117, 0.26);
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .bf-modern-contact .btn-submit:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 32px rgba(0, 117, 117, 0.36);
  }

  .bf-modern-contact .btn-submit:disabled {
    cursor: not-allowed;
    opacity: 0.75;
    transform: none;
    box-shadow: 0 6px 18px rgba(0, 117, 117, 0.18);
  }

  .bf-modern-contact .form-note {
    font-size: 13px;
    color: var(--bf-gray-400);
    display: flex;
    align-items: center;
    gap: 6px;
  }

  .bf-modern-contact .bf-response-error {
    background: #ffecec;
    border: 1px solid #ff8b8b;
    color: #b00000;
    border-radius: 10px;
    padding: 12px 14px;
    margin-bottom: 18px;
    font-size: 14px;
  }

  .bf-modern-contact .hp-field {
    position: absolute;
    left: -9999px;
    opacity: 0;
  }

  .bf-modern-contact .offices-section {
    background: #efefef;
    padding: 80px 24px;
    position: relative;
    overflow: hidden;
  }

  .bf-modern-contact .offices-section::before {
    display: none;
  }

  .bf-modern-contact .section-header {
    text-align: center;
    margin-bottom: 56px;
    position: relative;
    z-index: 1;
  }

  .bf-modern-contact .section-header .label {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--bf-brand-light-blue);
    margin-bottom: 12px;
  }

  .bf-modern-contact .section-header h2 {
    font-family: Helvetica, Roboto, Arial, sans-serif;
    font-size: clamp(30px, 4vw, 44px);
    font-weight: 800;
    color: var(--bf-text);
    margin: 0 0 14px;
  }

  .bf-modern-contact .section-header p {
    color: var(--bf-gray-600);
    font-size: 17px;
    max-width: 480px;
    margin: 0 auto;
  }

  .bf-modern-contact .offices-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 24px;
    max-width: 1320px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
  }

  .bf-modern-contact .office-card {
    background: var(--bf-white);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--bf-shadow);
    border: 1px solid var(--bf-gray-200);
    transition: transform 0.25s, box-shadow 0.25s;
    display: flex;
    flex-direction: column;
    padding: 0 !important;
  }

  .bf-modern-contact .office-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--bf-shadow-lg);
  }

  .bf-modern-contact .office-img {
    width: 100% !important;
    height: 180px;
    object-fit: cover;
    display: block;
    background: var(--bf-gray-200);
    margin: 0 !important;
    border-radius: 0 !important;
  }

  .bf-modern-contact .office-body {
    padding: 22px 22px 24px !important;
    flex: 1;
    display: flex;
    flex-direction: column;
  }

  .bf-modern-contact .office-region {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--bf-brand-light-blue);
    margin: 0 0 6px;
  }

  .bf-modern-contact .office-card h3 {
    font-family: Helvetica, Roboto, Arial, sans-serif;
    font-size: 22px;
    font-weight: 800;
    color: var(--bf-text);
    margin: 0 0 10px;
    line-height: 1.2;
  }

  .bf-modern-contact .office-card h3 a {
    color: inherit;
    transition: color 0.2s;
  }

  .bf-modern-contact .office-card h3 a:hover {
    color: var(--bf-brand-blue);
  }

  .bf-modern-contact .office-addr {
    font-size: 14px;
    color: var(--bf-gray-600);
    line-height: 1.6;
    margin: 0 0 16px;
    flex: 1;
  }

  .bf-modern-contact .office-contact {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 13px;
    color: var(--bf-gray-600);
    margin: 0 0 6px;
  }

  .bf-modern-contact .office-contact:hover {
    color: var(--bf-brand-blue);
  }

  .bf-modern-contact .office-contact svg {
    flex: 0 0 auto;
    color: var(--bf-brand-light-blue);
  }

  .bf-modern-contact .btn-quote {
    display: block;
    width: 100%;
    margin: 18px 0 0;
    background: transparent;
    color: var(--bf-brand-blue);
    border: 2px solid var(--bf-brand-blue);
    padding: 11px 20px;
    border-radius: 50px;
    font-family: Helvetica, Roboto, Arial, sans-serif;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    text-align: center;
    letter-spacing: 0;
    transition: background 0.2s, color 0.2s, transform 0.2s;
  }

  .bf-modern-contact .btn-quote:hover {
    background: var(--bf-brand-blue);
    color: #fff;
    transform: translateY(-1px);
  }

  @media (max-width: 900px) {
    .bf-modern-contact .form-section {
      padding: 28px 18px 54px;
      max-width: 100%;
    }

    .bf-modern-contact .form-layout {
      grid-template-columns: 1fr;
      border-radius: 16px;
    }

    .bf-modern-contact .contact-info-panel {
      padding: 34px 28px;
    }

    .bf-modern-contact .info-heading {
      font-size: 24px;
      line-height: 1.2;
    }

    .bf-modern-contact .form-card {
      padding: 36px 30px;
    }

    .bf-modern-contact .form-card h2 {
      font-size: 28px;
    }

    .bf-modern-contact .offices-section {
      padding: 56px 18px;
    }

    .bf-modern-contact .section-header {
      margin-bottom: 34px;
    }

    .bf-modern-contact .section-header h2 {
      font-size: 34px;
    }

    .bf-modern-contact .section-header p {
      font-size: 15px;
      max-width: 520px;
    }

    .bf-modern-contact .offices-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 18px;
    }
  }

  @media (max-width: 600px) {
    .bf-modern-contact .form-section {
      padding: 18px 12px 42px;
    }

    .bf-modern-contact .form-layout {
      border-radius: 12px;
      box-shadow: 0 8px 26px rgba(0, 0, 0, 0.12);
    }

    .bf-modern-contact .contact-info-panel {
      padding: 26px 18px;
    }

    .bf-modern-contact .info-label,
    .bf-modern-contact .social-label {
      font-size: 11px;
      letter-spacing: 0.8px;
    }

    .bf-modern-contact .info-heading {
      font-size: 21px;
      margin-bottom: 22px;
    }

    .bf-modern-contact .info-block {
      gap: 15px;
      margin-bottom: 22px;
    }

    .bf-modern-contact .info-item {
      gap: 11px;
    }

    .bf-modern-contact .info-icon {
      width: 34px;
      height: 34px;
      border-radius: 8px;
    }

    .bf-modern-contact .info-content a,
    .bf-modern-contact .info-content p {
      font-size: 13.5px;
    }

    .bf-modern-contact .form-card {
      padding: 26px 18px 28px;
    }

    .bf-modern-contact .form-card h2 {
      font-size: 24px;
      line-height: 1.18;
    }

    .bf-modern-contact .form-card .sub {
      font-size: 14px;
      margin-bottom: 24px;
    }

    .bf-modern-contact .form-grid {
      grid-template-columns: 1fr;
      gap: 16px;
    }

    .bf-modern-contact .form-group.full {
      grid-column: 1;
    }

    .bf-modern-contact .form-group label {
      font-size: 12px;
      line-height: 1.2;
    }

    .bf-modern-contact .form-group input,
    .bf-modern-contact .form-group select,
    .bf-modern-contact .form-group textarea {
      min-height: 48px;
      padding: 12px 14px;
      font-size: 14px;
      border-radius: 10px;
    }

    .bf-modern-contact .form-group textarea {
      min-height: 104px;
    }

    .bf-modern-contact .submit-row {
      flex-direction: column;
      align-items: stretch;
      gap: 12px;
      margin-top: 22px;
    }

    .bf-modern-contact .btn-submit {
      width: 100%;
      justify-content: center;
      padding: 14px 20px;
      font-size: 14px;
    }

    .bf-modern-contact .form-note {
      justify-content: center;
      text-align: center;
      font-size: 12.5px;
    }

    .bf-modern-contact .offices-section {
      padding: 46px 12px;
    }

    .bf-modern-contact .section-header {
      margin-bottom: 26px;
      padding: 0 6px;
    }

    .bf-modern-contact .section-header .label {
      font-size: 11px;
      letter-spacing: 1px;
      margin-bottom: 8px;
    }

    .bf-modern-contact .section-header h2 {
      font-size: 28px;
      margin-bottom: 10px;
    }

    .bf-modern-contact .section-header p {
      font-size: 14px;
      line-height: 1.45;
    }

    .bf-modern-contact .offices-grid {
      grid-template-columns: 1fr;
      gap: 16px;
      max-width: 420px;
    }

    .bf-modern-contact .office-card {
      border-radius: 12px;
    }

    .bf-modern-contact .office-img {
      height: 170px;
    }

    .bf-modern-contact .office-body {
      padding: 18px 18px 20px !important;
    }

    .bf-modern-contact .office-card h3 {
      font-size: 20px;
    }

    .bf-modern-contact .office-addr {
      font-size: 13.5px;
    }

    .bf-modern-contact .btn-quote {
      padding: 10px 16px;
      font-size: 13.5px;
    }

  }

/* ---- contact.html block 3 ---- */
.bf-footer {
    position: relative;
    background: var(--bf-dark);
    color: #c7cbcd;
    font-family: Arial, Helvetica, sans-serif;
    overflow: hidden;
    padding: 24px 38px 0;
  }

  .bf-footer * {
    box-sizing: border-box;
  }

  .bf-footer a {
    color: #c7cbcd;
    text-decoration: none;
    transition: 0.25s ease;
  }

  .bf-footer a:hover {
    color: #F15A24;
  }

  .bf-footer-wrap {
    max-width: 1500px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1.15fr 1.6fr 1fr;
    gap: 40px;
  }

  .bf-footer h3 {
    margin: 0 0 8px;
    font-size: 21px;
    line-height: 1.15;
    font-weight: 700;
    color: #c7cbcd;
    letter-spacing: 0.2px;
  }

  .bf-line {
    width: 90px;
    height: 2px;
    margin-bottom: 17px;
    background: linear-gradient(to right, #006B60 78%, #F15A24 78%);
  }

  .bf-cert-logo img {
    width: 255px;
    max-width: 100%;
    display: block;
    background: #fff;
  }

  .bf-social-title {
    margin-top: 50px !important;
  }

  .bf-sub-title {
    margin-top: 20px !important;
  }

  .bf-social {
    display: flex;
    gap: 14px;
    align-items: center;
    flex-wrap: wrap;
  }

  .bf-social a {
    width: 37px;
    height: 37px;
    border-radius: 50%;
    color: #fff;
    font-size: 17px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
  }

  .bf-social a:hover {
    transform: translateY(-3px);
    color: #fff;
  }

  .bf-social .whatsapp {
    background: #25D366;
  }

  .bf-social .facebook {
    background: #1877F2;
  }

  .bf-social .instagram {
    background: radial-gradient(circle at 30% 30%, #feda75, #d62976, #962fbf, #4f5bd5);
  }

  .bf-social .linkedin {
    background: #0A66C2;
  }

  .bf-social .youtube {
    background: #FF0000;
  }

  .bf-list,
  .bf-contact {
    padding: 0;
    margin: 0;
    list-style: none;
  }

  .bf-list li,
  .bf-contact li {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 9px;
    font-size: 15px;
    line-height: 1.32;
    color: #c7cbcd;
  }

  .bf-list span,
  .bf-contact span {
    width: 27px;
    min-width: 27px;
    height: 27px;
    border-radius: 50%;
    background: #006B60;
    color: #fff;
    font-size: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .bf-list li:hover span,
  .bf-contact li:hover span {
    background: #F15A24;
  }

  .bf-location {
    display: grid;
    grid-template-columns: 21px 1fr;
    gap: 12px;
    margin-bottom: 16px;
  }

  .bf-location>i {
    color: #F15A24;
    font-size: 19px;
    margin-top: 3px;
  }

  .bf-location strong {
    display: block;
    font-size: 15.8px;
    margin-bottom: 3px;
    color: #c7cbcd;
  }

  .bf-location p {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.35;
    color: #c7cbcd;
  }

  .bf-location a {
    display: block;
    color: #c7cbcd;
    text-decoration: none;
    word-break: normal;
    overflow-wrap: break-word;
  }

  .bf-location a:hover {
    color: #F15A24;
  }

  .bf-contact li {
    margin-bottom: 16px;
  }

  .bf-contact a {
    font-size: 15px;
  }

  .bf-copy {
    max-width: 1500px;
    margin: 18px auto 0;
    padding: 12px 10px;
    border-top: 1px solid rgba(0, 107, 96, 0.60);
    text-align: center;
    font-size: 14.5px;
    line-height: 1.35;
    color: #c7cbcd;
  }

  .bf-copy a {
    color: #F15A24;
    font-weight: 700;
  }

  .bf-copy a:hover {
    color: #000;
  }

  /* Sticky WhatsApp Chat Widget */
  .bf-chat-widget {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 9999;
    font-family: Arial, Helvetica, sans-serif;
  }

  .bf-chat-box {
    position: absolute;
    right: 0;
    bottom: 78px;
    width: 315px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition: all 0.3s ease;
    pointer-events: none;
  }

  .bf-chat-box.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
  }

  .bf-chat-message {
    width: 100%;
    background: #ffffff;
    color: #222222;
    padding: 14px 16px;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.4;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.16);
  }

  .bf-chat-option {
    background: #ffffff;
    color: #128C7E !important;
    text-decoration: none;
    padding: 10px 16px;
    border-radius: 7px;
    font-size: 13.5px;
    line-height: 1.2;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.14);
    transition: 0.25s ease;
    text-align: right;
  }

  .bf-chat-option:hover {
    background: #25D366;
    color: #ffffff !important;
    transform: translateY(-2px);
  }

  .bf-chat-button {
    position: relative;
    width: 58px;
    height: 58px;
    border: none;
    outline: none;
    border-radius: 50%;
    background: #25D366;
    color: #ffffff !important;
    font-size: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 8px 26px rgba(37, 211, 102, 0.35);
    transition: 0.25s ease;
    text-decoration: none;
  }

  .bf-chat-button:hover {
    background: #128C7E;
    color: #ffffff !important;
    transform: scale(1.06);
  }

  .bf-chat-badge {
    position: absolute;
    top: -5px;
    right: -3px;
    width: 21px;
    height: 21px;
    background: #ff3b30;
    color: #ffffff;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* Small pulse effect */
  .bf-chat-button::after {
    content: "";
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    border: 2px solid rgba(37, 211, 102, 0.45);
    animation: bfPulse 1.8s infinite;
  }

  @keyframes bfPulse {
    0% {
      transform: scale(0.95);
      opacity: 0.8;
    }

    100% {
      transform: scale(1.25);
      opacity: 0;
    }
  }

  @media (max-width: 767px) {
    .bf-chat-widget {
      right: 16px;
      bottom: 18px;
    }

    .bf-chat-box {
      width: 270px;
      bottom: 72px;
    }

    .bf-chat-button {
      width: 54px;
      height: 54px;
      font-size: 28px;
    }
  }

  /* Floating Call Icon */
  .custom-call-icon {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
    transition: transform 0.3s ease;
  }

  .custom-call-icon img {
    width: 50px;
    height: auto;
  }

  .custom-call-icon:hover {
    transform: scale(1.1);
  }

  @media (min-width: 768px) {
    .custom-call-icon {
      display: none;
    }
  }

  @media (max-width: 1200px) {
    .bf-footer-wrap {
      grid-template-columns: repeat(2, 1fr);
      gap: 32px 42px;
    }

    .bf-social-title {
      margin-top: 32px !important;
    }
  }

  @media (max-width: 768px) {
    .bf-footer {
      padding: 25px 22px 0;
    }

    .bf-footer-wrap {
      grid-template-columns: 1fr;
      gap: 30px;
    }

    .bf-footer h3 {
      font-size: 20px;
    }

    .bf-cert-logo img {
      width: 230px;
    }

    .bf-social-title,
    .bf-sub-title {
      margin-top: 24px !important;
    }

  }

  @media (max-width: 480px) {
    .bf-social a {
      width: 35px;
      height: 35px;
      font-size: 15px;
    }

    .bf-list li,
    .bf-contact li,
    .bf-location p {
      font-size: 14px;
    }

  }

/* ---- contact.html block 4 ---- */
/* =========================
   BF PAY LATER - VARIABLES
========================= */
    :root {
        --bf-offer-orange: var(--bf-primary-dark);
        --bf-offer-orange-dark: #e64c00;
        --bf-offer-navy: #10243d;
        --bf-offer-text: #1e293b;
        --bf-offer-muted: #64748b;
        --bf-offer-border: #e6e9ee;
        --bf-offer-white: #ffffff;
        --bf-offer-green: #16803d;
    }


    /* =========================
   PAGE OVERLAY
========================= */
    .bf-enpl-overlay {
        position: fixed;
        inset: 0;
        background: rgba(5, 15, 28, 0.38);
        z-index: 99997;

        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        transition:
            opacity 0.30s ease,
            visibility 0.30s ease;
    }

    .bf-enpl-overlay.is-visible {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }


    /* =========================
   POPUP PANEL
========================= */
    .bf-enpl-panel {
        position: fixed;
        top: 50%;
        left: 50%;

        width: min(440px, calc(100vw - 32px));
        max-height: calc(100dvh - 32px);

        background: var(--bf-offer-white);
        z-index: 99999;

        transform: translate(-50%, -48%) scale(.96);

        transition:
            opacity 0.28s ease,
            visibility 0.28s ease,
            transform 0.32s cubic-bezier(.22, .8, .26, 1);

        box-shadow:
            0 24px 70px rgba(0, 0, 0, 0.22);

        font-family:
            "Poppins",
            "Inter",
            Arial,
            Helvetica,
            sans-serif;

        display: flex;
        flex-direction: column;

        overflow-y: auto;
        overscroll-behavior: contain;
        border-radius: 18px;

        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        /* Helps browser isolate popup rendering */
        contain: layout paint;
    }

    .bf-enpl-panel.is-open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translate(-50%, -50%) scale(1);
    }


    /* =========================
   INNER
========================= */
    .bf-enpl-inner {
        width: 100%;

        padding: 28px 28px 22px;

        display: flex;
        flex-direction: column;
    }


    /* =========================
   CLOSE BUTTON
========================= */
    .bf-enpl-close {
        position: absolute;

        top: 14px;
        right: 14px;

        width: 40px;
        height: 40px;

        display: grid;
        place-items: center;

        border: 0;

        background: transparent;
        color: #253242;

        cursor: pointer;

        font-size: 30px;
        font-weight: 300;
        line-height: 1;

        border-radius: 50%;

        transition:
            background 0.2s ease,
            transform 0.2s ease;
    }

    .bf-enpl-close:hover {
        background: #f3f4f6;
        transform: rotate(5deg);
    }


    /* =========================
   OFFER BADGE
========================= */
    .bf-enpl-badge {
        display: inline-flex;
        align-items: center;

        gap: 8px;

        width: fit-content;

        padding: 8px 13px;

        margin:
            0 42px 16px 0;

        border-radius: 100px;

        background: #fff4ee;
        color: #a73b00;

        font-size: 13px;
        line-height: 1;
        font-weight: 700;
    }

    .bf-enpl-flag {
        position: relative;
        width: 20px;
        height: 14px;
        display: inline-block;
        flex: 0 0 20px;
        overflow: hidden;
        border: 1px solid rgba(167, 59, 0, 0.18);
        border-radius: 2px;
        background:
            linear-gradient(
                to bottom,
                var(--bf-primary) 0 33.33%,
                #ffffff 33.33% 66.66%,
                #138808 66.66% 100%
            );
    }

    .bf-enpl-flag::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        width: 5px;
        height: 5px;
        border: 1px solid #000080;
        border-radius: 50%;
        transform: translate(-50%, -50%);
    }


    /* =========================
   HEADLINE
========================= */
    .bf-enpl-title {
        margin: 0 0 9px;

        color: var(--bf-offer-navy);

        font-size: 34px;

        line-height: 1.08;

        letter-spacing: -1.4px;

        font-weight: 800;
        white-space: nowrap;
    }

    .bf-enpl-title-highlight {
        color: var(--bf-offer-orange);
    }


    /* =========================
   OFFER LINE
========================= */
    .bf-enpl-subtitle {
        margin: 0 0 18px;

        color: #384354;

        font-size: 15px;
        line-height: 1.45;
        font-weight: 500;
    }

    .bf-enpl-subtitle strong {
        color: var(--bf-offer-navy);
        font-weight: 800;
    }


    /* =========================
   15 / 85 PAYMENT CARD
========================= */
    .bf-enpl-payment {
        display: grid;

        grid-template-columns:
            1fr 44px 1fr;

        align-items: stretch;

        margin-bottom: 18px;
    }

    .bf-enpl-payment-card {
        min-height: 102px;

        display: flex;
        flex-direction: column;

        align-items: center;
        justify-content: center;

        padding: 16px 10px;

        border-radius: 9px;
        overflow: hidden;
    }

    .bf-enpl-payment-card:first-child {
        background:
            linear-gradient(135deg,
                #f0faf2 0%,
                #e9f7ee 100%);
    }

    .bf-enpl-payment-card:last-child {
        background:
            linear-gradient(135deg,
                #f1f6fd 0%,
                #edf4fc 100%);
    }

    .bf-enpl-percent {
        margin-bottom: 6px;

        font-size: 36px;
        line-height: 1;

        font-weight: 800;
    }

    .bf-enpl-payment-card:first-child .bf-enpl-percent {
        color: #126b3d;
    }

    .bf-enpl-payment-card:last-child .bf-enpl-percent {
        color: #124b86;
    }

    .bf-enpl-pay-label {
        color: var(--bf-offer-navy);

        font-size: 12px;
        line-height: 1.15;

        font-weight: 800;

        text-align: center;
        white-space: nowrap;
    }

    .bf-enpl-pay-small {
        margin-top: 6px;

        color: #4c5967;

        font-size: 10px;
        line-height: 1.2;

        text-align: center;
    }


    /* =========================
   PAYMENT ARROW
========================= */
    .bf-enpl-payment-arrow {
        display: flex;

        justify-content: center;
        align-items: center;
    }

    .bf-enpl-arrow-circle {
        width: 39px;
        height: 39px;

        display: grid;
        place-items: center;

        border:
            1px solid var(--bf-primary-light);

        border-radius: 50%;

        background: #fff;

        color:
            var(--bf-offer-navy);

        font-size: 23px;

        box-shadow:
            0 5px 15px rgba(20,
                35,
                55,
                0.08);
    }


    /* =========================
   CTA
========================= */
    .bf-enpl-cta {
        width: 100%;
        min-height: 52px;

        display: flex;

        align-items: center;
        justify-content: center;

        gap: 10px;

        padding:
            15px 22px;

        margin-bottom: 14px;

        border: 0;
        border-radius: 7px;

        background:
            linear-gradient(90deg,
                var(--bf-offer-orange) 0%,
                var(--bf-primary-dark) 100%);

        color: white;

        font-size: 16px;
        line-height: 1;

        font-weight: 750;

        text-decoration: none;

        cursor: pointer;

        box-shadow:
            0 10px 25px rgba(255,
                90,
                10,
                0.22);

        transition:
            transform 0.2s ease,
            box-shadow 0.2s ease,
            background 0.2s ease;
    }

    .bf-enpl-cta:hover {
        color: #fff;

        transform:
            translateY(-2px);

        box-shadow:
            0 14px 28px rgba(255,
                90,
                10,
                0.30);

        background:
            linear-gradient(90deg,
                #e94e00 0%,
                var(--bf-primary-dark) 100%);
    }

    .bf-enpl-cta-arrow {
        font-size: 21px;
    }


    /* =========================
   CONTACT DETAILS
========================= */
    .bf-enpl-contact {
        display: grid;

        grid-template-columns:
            1fr 1.35fr;

        gap: 0;

        margin-top: 0;
        margin-bottom: 12px;

        border:
            1px solid #e6e9ed;

        border-radius: 8px;

        background: #fff;
    }


    /*
   UPDATED:
   Bigger phone + email
*/
    .bf-enpl-contact-item {
        min-height: 54px;

        display: flex;

        align-items: center;

        gap: 9px;

        padding:
            12px 11px;

        color: #263443;

        font-size: 12px;
        line-height: 1.3;

        font-weight: 600;

        text-decoration: none;

        overflow-wrap: anywhere;
    }

    .bf-enpl-contact-item:first-child {
        border-right:
            1px solid #e6e9ed;
    }

    .bf-enpl-contact-item:hover {
        color:
            var(--bf-offer-orange);
    }


    /*
   UPDATED:
   Slightly bigger icon
*/
    .bf-enpl-contact-icon {
        color:
            var(--bf-offer-navy);

        font-size: 18px;

        flex-shrink: 0;
    }


    /* =========================
   TERMS
========================= */
    .bf-enpl-terms {
        margin: 0;

        color: #7a838e;

        font-size: 9px;
        line-height: 1.5;

        text-align: center;
    }


    /* =========================
   OFFER BUBBLE
========================= */
    .bf-enpl-bubble {
        position: fixed;

        left: 24px;
        bottom: 24px;

        z-index: 99996;

        width: 82px;
        height: 82px;

        display: flex;
        flex-direction: column;

        align-items: center;
        justify-content: center;

        gap: 3px;

        padding: 5px;

        border:
            2px solid var(--bf-primary-light);

        border-radius: 50%;

        background: #fff;

        color:
            var(--bf-offer-orange);

        cursor: pointer;

        opacity: 0;
        visibility: hidden;

        transform:
            scale(.8);

        box-shadow:
            0 7px 24px rgba(19,
                32,
                45,
                0.16);

        transition:
            opacity .25s ease,
            visibility .25s ease,
            transform .25s ease,
            box-shadow .25s ease;

        font-family:
            "Poppins",
            Arial,
            sans-serif;
    }

    .bf-enpl-bubble.is-visible {
        opacity: 1;
        visibility: visible;

        transform:
            scale(1);
    }

    .bf-enpl-bubble:hover {
        transform:
            scale(1.06);

        box-shadow:
            0 11px 29px rgba(255,
                90,
                10,
                0.22);
    }

    .bf-enpl-bubble-gift {
        font-size: 24px;
        line-height: 1;
    }

    .bf-enpl-bubble-text {
        font-size: 9px;
        line-height: 1.1;

        font-weight: 800;

        text-align: center;
    }


    /* Bubble accent ring */
    .bf-enpl-bubble::after {
        content: "";

        position: absolute;

        inset: -6px;

        border:
            1px solid rgba(255,
                90,
                10,
                .18);

        border-radius: inherit;

        pointer-events: none;
    }


    /* =========================
   MOBILE
========================= */
@media (max-width: 600px) {

        .bf-enpl-panel {
            width:
                min(410px,
                    94vw);
            border-radius: 15px;
        }

        .bf-enpl-inner {
            padding:
                24px 18px 18px;
        }

        .bf-enpl-title {
            font-size: 27px;
            letter-spacing: -1px;
        }

        .bf-enpl-subtitle {
            font-size: 14px;
            margin-bottom: 20px;
        }

        .bf-enpl-payment-card {
            min-height: 92px;

            padding:
                13px 7px;
        }

        .bf-enpl-percent {
            font-size: 30px;
        }

        .bf-enpl-pay-label {
            font-size: 10.5px;
        }

        .bf-enpl-pay-small {
            font-size: 9px;
        }

        .bf-enpl-payment {
            grid-template-columns:
                1fr 36px 1fr;
        }

        .bf-enpl-arrow-circle {
            width: 33px;
            height: 33px;

            font-size: 19px;
        }

        .bf-enpl-contact-item {
            min-height: 46px;

            /* Bigger on mobile too */
            font-size: 11px;
        }

        .bf-enpl-bubble {
            width: 68px;
            height: 68px;

            left: 16px;
            bottom: 18px;
        }

        .bf-enpl-bubble-gift {
            font-size: 20px;
        }

        .bf-enpl-bubble-text {
            font-size: 8px;
        }
}


/* =========================
   TABLET
========================= */
@media (min-width: 601px) and (max-width: 1024px) {

    .bf-enpl-contact {
        margin-top: 12px;
    }
}


/* =========================
   SHORT DESKTOP SCREENS
========================= */
    @media (max-height: 760px) and (min-width: 601px) {

        .bf-enpl-inner {
            padding-top: 26px;
            padding-bottom: 18px;
        }

        .bf-enpl-badge {
            margin-bottom: 13px;
        }

        .bf-enpl-title {
            font-size: 35px;
        }

        .bf-enpl-subtitle {
            margin-bottom: 16px;

            font-size: 14px;
        }

        .bf-enpl-payment {
            margin-bottom: 16px;
        }

        .bf-enpl-payment-card {
            min-height: 96px;
        }

        .bf-enpl-percent {
            font-size: 35px;
        }

        .bf-enpl-cta {
            min-height: 49px;
        }
    }


    /* =========================
   ACCESSIBILITY
========================= */
    @media (prefers-reduced-motion: reduce) {

        .bf-enpl-panel,
        .bf-enpl-overlay,
        .bf-enpl-bubble {
            transition: none;
        }
    }
/* ==================== Contact map embed ==================== */
.bf-contact-map { max-width: 1200px; margin: 0 auto 40px; border-radius: 14px; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,0.08); }
.bf-contact-map iframe { display: block; width: 100%; }

/* ==================== Global map section heading ==================== */
.global-map-heading { text-align: center; max-width: 700px; margin: 0 auto 36px; }
.global-map-heading p { color: #555; font-size: 15px; line-height: 1.6; margin-top: 10px; }


/* ==================== about.html ==================== */

/* ---- about.html block 1 ---- */
#bfSiteHeader .bf-main {
                    height: var(--bf-main-height) !important;
                    min-height: var(--bf-main-height) !important;
                    padding: 0 !important;
                }

                #bfSiteHeader .bf-main-shell {
                    height: var(--bf-main-height) !important;
                    padding-top: 0 !important;
                    padding-bottom: 0 !important;
                }

                .page-sections:empty {
                    display: none !important;
                    height: 0 !important;
                    min-height: 0 !important;
                    margin: 0 !important;
                    padding: 0 !important;
                }

/* ---- about.html block 2 ---- */
@import url('https://fonts.googleapis.com/css2?family=Mako&family=Muli:wght@300;400;500;600;700;800;900&family=Source+Sans+Pro:wght@300;400;600;700;900&display=swap');

  h1,
  .source-sans {
    font-family: 'Source Sans Pro', sans-serif;
  }

  h2,
  .mako {
    font-family: 'Mako', sans-serif;
  }

  p,
  .muli {
    font-family: 'Muli', sans-serif;
  }

  .about {
    font-size: 24px;
    font-weight: 600;
    margin-top: 12px;
  }

  .about-hero {
    position: relative;
    width: 100%;
    min-height: clamp(390px, 34vw, 520px);
    display: flex;
    align-items: center;
    padding: clamp(48px, 5vw, 82px) clamp(20px, 6vw, 110px);
    background-image: linear-gradient(90deg, rgba(0, 0, 0, .90) 0%, rgba(0, 0, 0, .74) 42%, rgba(0, 0, 0, .42) 72%, rgba(0, 0, 0, .18) 100%), url('assets/images/portfolio_images/overseas-pvt-ltd-exhibition-stand-bharatiya-vyapar-mahotsav-2026.webp');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    overflow: hidden;
  }

  .about-hero::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 20% 20%, rgba(0, 166, 166, .20), transparent 32%);
    pointer-events: none;
  }

  .about-hero-inner {
    position: relative;
    z-index: 2;
    max-width: 760px;
  }

  .about-eyebrow {
    display: inline-flex;
    align-items: center;
    padding: 8px 16px;
    border: 1px solid rgba(0, 166, 166, .45);
    background: rgba(0, 166, 166, .12);
    border-radius: 999px;
    color: var(--bf-primary);
    font-size: 14px;
    line-height: 1;
    font-weight: 800;
    margin-bottom: 22px;
  }

  .about-hero h1 {
    margin: 0;
    color: #fff;
    font-family: 'Source Sans Pro', Arial, sans-serif;
    font-size: clamp(34px, 3.8vw, 54px);
    line-height: 1.06;
    font-weight: 900;
  }

  .about-hero h1 span {
    color: var(--bf-primary);
  }

  .about-hero p {
    max-width: 650px;
    margin: 16px 0 0;
    color: rgba(255, 255, 255, .92);
    font-size: 16px;
    line-height: 1.45;
    font-weight: 500;
  }

  .about-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 32px;
  }

  .about-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 14px 24px;
    border-radius: 10px;
    text-decoration: none;
    font-weight: 800;
    transition: transform .2s ease, background .2s ease, border-color .2s ease;
  }

  .about-btn-primary {
    background: var(--bf-primary);
    color: #fff;
    border: 1px solid var(--bf-primary);
  }

  .about-btn-primary:hover {
    background: #e66400;
    color: #fff;
    transform: translateY(-2px);
  }

  .about-btn-outline {
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .45);
    background: rgba(255, 255, 255, .04);
  }

  .about-btn-outline:hover {
    border-color: #fff;
    color: #fff;
    transform: translateY(-2px);
  }

  .global-presence-section {
    padding-top: 35px !important;
    padding-bottom: 35px !important;
  }

  .global-presence-section .sub-title {
    margin-bottom: 14px !important;
  }

  .global-presence-section p {
    margin-top: 0;
    margin-bottom: 0;
  }

  .global-presence-image {
    display: block;
    width: 100%;
    height: auto;
    margin-top: 22px;
  }

  .global-presence-note {
    margin-top: 18px !important;
    line-height: 1.7;
  }

  .certification-section {
    padding-top: 35px !important;
    padding-bottom: 35px !important;
  }

  .certification-card {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 28px;
    align-items: center;
    padding: 28px;
    border: 1px solid #e9e9e9;
    background: #fff;
    box-shadow: 0 12px 34px rgba(0, 0, 0, .08);
  }

  .certification-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 150px;
    padding: 18px;
    border: 1px solid #f0f0f0;
    background: #fafafa;
  }

  .certification-logo img {
    display: block;
    max-width: 100%;
    height: auto;
  }

  .certification-content .sub-title {
    margin-bottom: 14px !important;
  }

  .certification-content p {
    margin-top: 0;
    margin-bottom: 12px;
    line-height: 1.7;
  }

  .certification-content p:last-child {
    margin-bottom: 0;
  }

  .about-info-section {
    padding-top: 35px !important;
    padding-bottom: 35px !important;
  }

  .about-info-section .sub-title {
    margin-bottom: 16px !important;
  }

  .about-info-section p {
    line-height: 1.7;
    margin-top: 0;
  }

  .numbers-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
  }

  .number-item {
    padding: 20px;
    border: 1px solid #e9e9e9;
    background: #fff;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .05);
  }

  .number-item strong {
    display: block;
    color: var(--bf-primary);
    font-family: 'Source Sans Pro', Arial, sans-serif;
    font-size: 32px;
    line-height: 1;
    font-weight: 900;
    margin-bottom: 8px;
  }

  .work-with-us-section {
    padding-top: 35px !important;
    padding-bottom: 50px !important;
  }

  .work-with-us-box {
    padding: 30px;
    background: #111;
    color: #fff;
  }

  .work-with-us-box .sub-title,
  .work-with-us-box p {
    color: #fff;
  }

  .work-with-us-box .sub-title {
    margin-bottom: 14px !important;
  }

  .work-with-us-box p {
    margin: 0;
    line-height: 1.7;
  }

  .work-with-us-contact {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 22px;
  }

  .work-with-us-contact a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 12px 18px;
    border: 1px solid rgba(255, 255, 255, .35);
    color: #fff;
    text-decoration: none;
    font-weight: 800;
  }

  .work-with-us-contact a:hover {
    background: var(--bf-primary);
    border-color: var(--bf-primary);
    color: #fff;
  }

  @media (max-width: 768px) {
    .certification-card {
      grid-template-columns: 1fr;
      padding: 22px;
    }

    .certification-logo {
      min-height: auto;
    }

    .numbers-grid {
      grid-template-columns: 1fr;
    }
  }

  .who-we-are-section,
  .what-we-do-section {
    padding-top: 35px !important;
    padding-bottom: 35px !important;
  }

  .who-we-are-section .sub-title,
  .what-we-do-section .sub-title {
    margin-bottom: 14px !important;
  }

  .who-we-are-section p,
  .what-we-do-section p {
    margin-top: 0;
  }

  .what-we-do-section .booth-intro {
    margin-bottom: 18px !important;
  }

  /* Base (desktop-first) */
  .booth-points {
    margin-top: 25px;
    margin-bottom: 40px;
  }

  .booth-points li {
    position: relative;
    padding-left: clamp(26px, 6vw, 35px);
    /* tighter on mobile, original on desktop */
    margin-bottom: clamp(10px, 3.2vw, 15px);
    font-size: clamp(14px, 4vw, 18px);
    /* 14px on small phones → 18px on desktop */
    line-height: 1.6;
    font-weight: 500;
    color: #222;
  }

  .booth-points li::before {
    content: "\2713";
    position: absolute;
    left: 0;
    top: 0.1em;
    /* better vertical alignment across sizes */
    color: var(--bf-primary-dark);
    font-weight: 700;
    font-size: clamp(14px, 4.2vw, 18px);
    margin-bottom: 30px;
    /* 👈 adds space below the list */
  }

  /* Extra polish for very small devices */
  @media (max-width: 480px) {
    .booth-points li {
      word-wrap: break-word;
      hyphens: auto;
    }
  }

  /* Optional: reduce motion users */
  @media (prefers-reduced-motion: reduce) {

    .booth-points li,
    .booth-points li::before {
      transition: none !important;
    }
  }

  @media (max-width: 768px) {
    .about-hero {
      min-height: auto;
      padding: 70px 18px 65px;
      background-image: linear-gradient(90deg, rgba(0, 0, 0, .92) 0%, rgba(0, 0, 0, .80) 58%, rgba(0, 0, 0, .48) 100%), url('assets/images/portfolio_images/overseas-pvt-ltd-exhibition-stand-bharatiya-vyapar-mahotsav-2026.webp');
      align-items: flex-start;
    }

    .about-hero-inner {
      width: 100%;
      max-width: 100%;
    }

    .about-hero h1 {
      font-size: 46px;
      line-height: 1.08;
    }

    .about-hero p {
      max-width: 100%;
      font-size: 17px;
      line-height: 1.6;
    }
  }

  @media (max-width: 560px) {
    .about-hero {
      padding: 115px 10px 42px;
      background-position: center center;
    }

    .about-eyebrow {
      font-size: 12px;
      padding: 6px 12px;
      margin-bottom: 16px;
      white-space: normal;
      line-height: 1.3;
    }

    .about-hero h1 {
      font-size: 30px;
      line-height: 1.08;
    }

    .about-hero p {
      font-size: 14px;
      line-height: 1.42;
      margin-top: 12px;
    }

    .about-hero-actions {
      width: 100%;
      flex-direction: column;
      align-items: stretch;
      gap: 14px;
      margin-top: 24px;
    }

    .about-hero-actions .about-btn {
      width: 100%;
      min-height: 52px;
      padding: 14px 18px;
      text-align: center;
    }
  }

/* ---- about.html block 3 ---- */
.touch-image-wrap {
    width: 100%;
    height: clamp(560px, 46vw, 650px);
    overflow: hidden;
    border-radius: 12px;
  }

  .touch-image-col {
    margin-top: -16px;
  }

  .touch-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }

  .touch-drag-wrap {
    position: relative;
    cursor: ew-resize;
    --split-position: 50%;
    touch-action: none;
    user-select: none;
  }

  .touch-drag-wrap .touch-image {
    position: absolute;
    inset: 0;
    pointer-events: none;
    user-select: none;
  }

  .touch-drag-overlay {
    z-index: 2;
    clip-path: inset(0 calc(100% - var(--split-position)) 0 0);
    will-change: clip-path;
  }

  .touch-drag-handle {
    position: absolute;
    top: 0;
    bottom: 0;
    left: var(--split-position);
    width: 2px;
    background: #fff;
    z-index: 3;
    pointer-events: none;
    transform: translateX(-50%);
    will-change: left;
  }

  @media (max-width: 1199px) {
    .touch-image-wrap {
      height: clamp(500px, 56vw, 600px);
    }
  }

  @media (max-width: 991px) {
    .touch-image-col {
      margin-top: -12px;
    }

    .touch-image-wrap {
      height: clamp(460px, 66vw, 560px);
    }
  }

  @media (max-width: 767px) {
    .touch-image-col {
      margin-bottom: -28px;
    }

    .touch-image-wrap {
      height: clamp(360px, 78vw, 480px);
      border-radius: 10px;
    }
  }

  @media (max-width: 480px) {
    .touch-image-col {
      margin-top: -8px;
      margin-bottom: -36px;
    }

    .touch-image-wrap {
      height: clamp(300px, 82vw, 390px);
      border-radius: 8px;
    }
  }

/* ---- about.html block 4 ---- */
.bf-footer {
    position: relative;
    background: var(--bf-dark);
    color: #c7cbcd;
    font-family: Arial, Helvetica, sans-serif;
    overflow: hidden;
    padding: 24px 38px 0;
  }

  .bf-footer * {
    box-sizing: border-box;
  }

  .bf-footer a {
    color: #c7cbcd;
    text-decoration: none;
    transition: 0.25s ease;
  }

  .bf-footer a:hover {
    color: #F15A24;
  }

  .bf-footer-wrap {
    max-width: 1500px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1.15fr 1.6fr 1fr;
    gap: 40px;
  }

  .bf-footer h3 {
    margin: 0 0 8px;
    font-size: 21px;
    line-height: 1.15;
    font-weight: 700;
    color: #c7cbcd;
    letter-spacing: 0.2px;
  }

  .bf-line {
    width: 90px;
    height: 2px;
    margin-bottom: 17px;
    background: linear-gradient(to right, #006B60 78%, #F15A24 78%);
  }

  .bf-cert-logo img {
    width: 255px;
    max-width: 100%;
    display: block;
    background: #fff;
  }

  .bf-social-title {
    margin-top: 50px !important;
  }

  .bf-sub-title {
    margin-top: 20px !important;
  }

  .bf-social {
    display: flex;
    gap: 14px;
    align-items: center;
    flex-wrap: wrap;
  }

  .bf-social a {
    width: 37px;
    height: 37px;
    border-radius: 50%;
    color: #fff;
    font-size: 17px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
  }

  .bf-social a:hover {
    transform: translateY(-3px);
    color: #fff;
  }

  .bf-social .whatsapp {
    background: #25D366;
  }

  .bf-social .facebook {
    background: #1877F2;
  }

  .bf-social .instagram {
    background: radial-gradient(circle at 30% 30%, #feda75, #d62976, #962fbf, #4f5bd5);
  }

  .bf-social .linkedin {
    background: #0A66C2;
  }

  .bf-social .youtube {
    background: #FF0000;
  }

  .bf-list,
  .bf-contact {
    padding: 0;
    margin: 0;
    list-style: none;
  }

  .bf-list li,
  .bf-contact li {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 9px;
    font-size: 15px;
    line-height: 1.32;
    color: #c7cbcd;
  }

  .bf-list span,
  .bf-contact span {
    width: 27px;
    min-width: 27px;
    height: 27px;
    border-radius: 50%;
    background: #006B60;
    color: #fff;
    font-size: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .bf-list li:hover span,
  .bf-contact li:hover span {
    background: #F15A24;
  }

  .bf-location {
    display: grid;
    grid-template-columns: 21px 1fr;
    gap: 12px;
    margin-bottom: 16px;
  }

  .bf-location>i {
    color: #F15A24;
    font-size: 19px;
    margin-top: 3px;
  }

  .bf-location strong {
    display: block;
    font-size: 15.8px;
    margin-bottom: 3px;
    color: #c7cbcd;
  }

  .bf-location p {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.35;
    color: #c7cbcd;
  }

  .bf-location a {
    display: block;
    color: #c7cbcd;
    text-decoration: none;
    word-break: normal;
    overflow-wrap: break-word;
  }

  .bf-location a:hover {
    color: #F15A24;
  }

  .bf-contact li {
    margin-bottom: 16px;
  }

  .bf-contact a {
    font-size: 15px;
  }

  .bf-copy {
    max-width: 1500px;
    margin: 18px auto 0;
    padding: 12px 10px;
    border-top: 1px solid rgba(0, 107, 96, 0.60);
    text-align: center;
    font-size: 14.5px;
    line-height: 1.35;
    color: #c7cbcd;
  }

  .bf-copy a {
    color: #F15A24;
    font-weight: 700;
  }

  .bf-copy a:hover {
    color: #000;
  }

  /* Sticky WhatsApp Chat Widget */
  .bf-chat-widget {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 9999;
    font-family: Arial, Helvetica, sans-serif;
  }

  .bf-chat-box {
    position: absolute;
    right: 0;
    bottom: 78px;
    width: 315px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition: all 0.3s ease;
    pointer-events: none;
  }

  .bf-chat-box.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
  }

  .bf-chat-message {
    width: 100%;
    background: #ffffff;
    color: #222222;
    padding: 14px 16px;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.4;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.16);
  }

  .bf-chat-option {
    background: #ffffff;
    color: #128C7E !important;
    text-decoration: none;
    padding: 10px 16px;
    border-radius: 7px;
    font-size: 13.5px;
    line-height: 1.2;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.14);
    transition: 0.25s ease;
    text-align: right;
  }

  .bf-chat-option:hover {
    background: #25D366;
    color: #ffffff !important;
    transform: translateY(-2px);
  }

  .bf-chat-button {
    position: relative;
    width: 58px;
    height: 58px;
    border: none;
    outline: none;
    border-radius: 50%;
    background: #25D366;
    color: #ffffff !important;
    font-size: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 8px 26px rgba(37, 211, 102, 0.35);
    transition: 0.25s ease;
    text-decoration: none;
  }

  .bf-chat-button:hover {
    background: #128C7E;
    color: #ffffff !important;
    transform: scale(1.06);
  }

  .bf-chat-badge {
    position: absolute;
    top: -5px;
    right: -3px;
    width: 21px;
    height: 21px;
    background: #ff3b30;
    color: #ffffff;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* Small pulse effect */
  .bf-chat-button::after {
    content: "";
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    border: 2px solid rgba(37, 211, 102, 0.45);
    animation: bfPulse 1.8s infinite;
  }

  @keyframes bfPulse {
    0% {
      transform: scale(0.95);
      opacity: 0.8;
    }

    100% {
      transform: scale(1.25);
      opacity: 0;
    }
  }

  @media (max-width: 767px) {
    .bf-chat-widget {
      right: 16px;
      bottom: 18px;
    }

    .bf-chat-box {
      width: 270px;
      bottom: 72px;
    }

    .bf-chat-button {
      width: 54px;
      height: 54px;
      font-size: 28px;
    }
  }

  /* Floating Call Icon */
  .custom-call-icon {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
    transition: transform 0.3s ease;
  }

  .custom-call-icon img {
    width: 50px;
    height: auto;
  }

  .custom-call-icon:hover {
    transform: scale(1.1);
  }

  @media (min-width: 768px) {
    .custom-call-icon {
      display: none;
    }
  }

  @media (max-width: 1200px) {
    .bf-footer-wrap {
      grid-template-columns: repeat(2, 1fr);
      gap: 32px 42px;
    }

    .bf-social-title {
      margin-top: 32px !important;
    }
  }

  @media (max-width: 768px) {
    .bf-footer {
      padding: 25px 22px 0;
    }

    .bf-footer-wrap {
      grid-template-columns: 1fr;
      gap: 30px;
    }

    .bf-footer h3 {
      font-size: 20px;
    }

    .bf-cert-logo img {
      width: 230px;
    }

    .bf-social-title,
    .bf-sub-title {
      margin-top: 24px !important;
    }

  }

  @media (max-width: 480px) {
    .bf-social a {
      width: 35px;
      height: 35px;
      font-size: 15px;
    }

    .bf-list li,
    .bf-contact li,
    .bf-location p {
      font-size: 14px;
    }

  }

/* ---- about.html block 5 ---- */
/* =========================
   BF PAY LATER - VARIABLES
========================= */
    :root {
        --bf-offer-orange: var(--bf-primary-dark);
        --bf-offer-orange-dark: #e64c00;
        --bf-offer-navy: #10243d;
        --bf-offer-text: #1e293b;
        --bf-offer-muted: #64748b;
        --bf-offer-border: #e6e9ee;
        --bf-offer-white: #ffffff;
        --bf-offer-green: #16803d;
    }


    /* =========================
   PAGE OVERLAY
========================= */
    .bf-enpl-overlay {
        position: fixed;
        inset: 0;
        background: rgba(5, 15, 28, 0.38);
        z-index: 99997;

        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        transition:
            opacity 0.30s ease,
            visibility 0.30s ease;
    }

    .bf-enpl-overlay.is-visible {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }


    /* =========================
   POPUP PANEL
========================= */
    .bf-enpl-panel {
        position: fixed;
        top: 50%;
        left: 50%;

        width: min(440px, calc(100vw - 32px));
        max-height: calc(100dvh - 32px);

        background: var(--bf-offer-white);
        z-index: 99999;

        transform: translate(-50%, -48%) scale(.96);

        transition:
            opacity 0.28s ease,
            visibility 0.28s ease,
            transform 0.32s cubic-bezier(.22, .8, .26, 1);

        box-shadow:
            0 24px 70px rgba(0, 0, 0, 0.22);

        font-family:
            "Poppins",
            "Inter",
            Arial,
            Helvetica,
            sans-serif;

        display: flex;
        flex-direction: column;

        overflow-y: auto;
        overscroll-behavior: contain;
        border-radius: 18px;

        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        /* Helps browser isolate popup rendering */
        contain: layout paint;
    }

    .bf-enpl-panel.is-open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translate(-50%, -50%) scale(1);
    }


    /* =========================
   INNER
========================= */
    .bf-enpl-inner {
        width: 100%;

        padding: 28px 28px 22px;

        display: flex;
        flex-direction: column;
    }


    /* =========================
   CLOSE BUTTON
========================= */
    .bf-enpl-close {
        position: absolute;

        top: 14px;
        right: 14px;

        width: 40px;
        height: 40px;

        display: grid;
        place-items: center;

        border: 0;

        background: transparent;
        color: #253242;

        cursor: pointer;

        font-size: 30px;
        font-weight: 300;
        line-height: 1;

        border-radius: 50%;

        transition:
            background 0.2s ease,
            transform 0.2s ease;
    }

    .bf-enpl-close:hover {
        background: #f3f4f6;
        transform: rotate(5deg);
    }


    /* =========================
   OFFER BADGE
========================= */
    .bf-enpl-badge {
        display: inline-flex;
        align-items: center;

        gap: 8px;

        width: fit-content;

        padding: 8px 13px;

        margin:
            0 42px 16px 0;

        border-radius: 100px;

        background: #fff4ee;
        color: #a73b00;

        font-size: 13px;
        line-height: 1;
        font-weight: 700;
    }

    .bf-enpl-flag {
        position: relative;
        width: 20px;
        height: 14px;
        display: inline-block;
        flex: 0 0 20px;
        overflow: hidden;
        border: 1px solid rgba(167, 59, 0, 0.18);
        border-radius: 2px;
        background:
            linear-gradient(
                to bottom,
                var(--bf-primary) 0 33.33%,
                #ffffff 33.33% 66.66%,
                #138808 66.66% 100%
            );
    }

    .bf-enpl-flag::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        width: 5px;
        height: 5px;
        border: 1px solid #000080;
        border-radius: 50%;
        transform: translate(-50%, -50%);
    }


    /* =========================
   HEADLINE
========================= */
    .bf-enpl-title {
        margin: 0 0 9px;

        color: var(--bf-offer-navy);

        font-size: 34px;

        line-height: 1.08;

        letter-spacing: -1.4px;

        font-weight: 800;
        white-space: nowrap;
    }

    .bf-enpl-title-highlight {
        color: var(--bf-offer-orange);
    }


    /* =========================
   OFFER LINE
========================= */
    .bf-enpl-subtitle {
        margin: 0 0 18px;

        color: #384354;

        font-size: 15px;
        line-height: 1.45;
        font-weight: 500;
    }

    .bf-enpl-subtitle strong {
        color: var(--bf-offer-navy);
        font-weight: 800;
    }


    /* =========================
   15 / 85 PAYMENT CARD
========================= */
    .bf-enpl-payment {
        display: grid;

        grid-template-columns:
            1fr 44px 1fr;

        align-items: stretch;

        margin-bottom: 18px;
    }

    .bf-enpl-payment-card {
        min-height: 102px;

        display: flex;
        flex-direction: column;

        align-items: center;
        justify-content: center;

        padding: 16px 10px;

        border-radius: 9px;
        overflow: hidden;
    }

    .bf-enpl-payment-card:first-child {
        background:
            linear-gradient(135deg,
                #f0faf2 0%,
                #e9f7ee 100%);
    }

    .bf-enpl-payment-card:last-child {
        background:
            linear-gradient(135deg,
                #f1f6fd 0%,
                #edf4fc 100%);
    }

    .bf-enpl-percent {
        margin-bottom: 6px;

        font-size: 36px;
        line-height: 1;

        font-weight: 800;
    }

    .bf-enpl-payment-card:first-child .bf-enpl-percent {
        color: #126b3d;
    }

    .bf-enpl-payment-card:last-child .bf-enpl-percent {
        color: #124b86;
    }

    .bf-enpl-pay-label {
        color: var(--bf-offer-navy);

        font-size: 12px;
        line-height: 1.15;

        font-weight: 800;

        text-align: center;
        white-space: nowrap;
    }

    .bf-enpl-pay-small {
        margin-top: 6px;

        color: #4c5967;

        font-size: 10px;
        line-height: 1.2;

        text-align: center;
    }


    /* =========================
   PAYMENT ARROW
========================= */
    .bf-enpl-payment-arrow {
        display: flex;

        justify-content: center;
        align-items: center;
    }

    .bf-enpl-arrow-circle {
        width: 39px;
        height: 39px;

        display: grid;
        place-items: center;

        border:
            1px solid var(--bf-primary-light);

        border-radius: 50%;

        background: #fff;

        color:
            var(--bf-offer-navy);

        font-size: 23px;

        box-shadow:
            0 5px 15px rgba(20,
                35,
                55,
                0.08);
    }


    /* =========================
   CTA
========================= */
    .bf-enpl-cta {
        width: 100%;
        min-height: 52px;

        display: flex;

        align-items: center;
        justify-content: center;

        gap: 10px;

        padding:
            15px 22px;

        margin-bottom: 14px;

        border: 0;
        border-radius: 7px;

        background:
            linear-gradient(90deg,
                var(--bf-offer-orange) 0%,
                var(--bf-primary-dark) 100%);

        color: white;

        font-size: 16px;
        line-height: 1;

        font-weight: 750;

        text-decoration: none;

        cursor: pointer;

        box-shadow:
            0 10px 25px rgba(255,
                90,
                10,
                0.22);

        transition:
            transform 0.2s ease,
            box-shadow 0.2s ease,
            background 0.2s ease;
    }

    .bf-enpl-cta:hover {
        color: #fff;

        transform:
            translateY(-2px);

        box-shadow:
            0 14px 28px rgba(255,
                90,
                10,
                0.30);

        background:
            linear-gradient(90deg,
                #e94e00 0%,
                var(--bf-primary-dark) 100%);
    }

    .bf-enpl-cta-arrow {
        font-size: 21px;
    }


    /* =========================
   CONTACT DETAILS
========================= */
    .bf-enpl-contact {
        display: grid;

        grid-template-columns:
            1fr 1.35fr;

        gap: 0;

        margin-top: 0;
        margin-bottom: 12px;

        border:
            1px solid #e6e9ed;

        border-radius: 8px;

        background: #fff;
    }


    /*
   UPDATED:
   Bigger phone + email
*/
    .bf-enpl-contact-item {
        min-height: 54px;

        display: flex;

        align-items: center;

        gap: 9px;

        padding:
            12px 11px;

        color: #263443;

        font-size: 12px;
        line-height: 1.3;

        font-weight: 600;

        text-decoration: none;

        overflow-wrap: anywhere;
    }

    .bf-enpl-contact-item:first-child {
        border-right:
            1px solid #e6e9ed;
    }

    .bf-enpl-contact-item:hover {
        color:
            var(--bf-offer-orange);
    }


    /*
   UPDATED:
   Slightly bigger icon
*/
    .bf-enpl-contact-icon {
        color:
            var(--bf-offer-navy);

        font-size: 18px;

        flex-shrink: 0;
    }


    /* =========================
   TERMS
========================= */
    .bf-enpl-terms {
        margin: 0;

        color: #7a838e;

        font-size: 9px;
        line-height: 1.5;

        text-align: center;
    }


    /* =========================
   OFFER BUBBLE
========================= */
    .bf-enpl-bubble {
        position: fixed;

        left: 24px;
        bottom: 24px;

        z-index: 99996;

        width: 82px;
        height: 82px;

        display: flex;
        flex-direction: column;

        align-items: center;
        justify-content: center;

        gap: 3px;

        padding: 5px;

        border:
            2px solid var(--bf-primary-light);

        border-radius: 50%;

        background: #fff;

        color:
            var(--bf-offer-orange);

        cursor: pointer;

        opacity: 0;
        visibility: hidden;

        transform:
            scale(.8);

        box-shadow:
            0 7px 24px rgba(19,
                32,
                45,
                0.16);

        transition:
            opacity .25s ease,
            visibility .25s ease,
            transform .25s ease,
            box-shadow .25s ease;

        font-family:
            "Poppins",
            Arial,
            sans-serif;
    }

    .bf-enpl-bubble.is-visible {
        opacity: 1;
        visibility: visible;

        transform:
            scale(1);
    }

    .bf-enpl-bubble:hover {
        transform:
            scale(1.06);

        box-shadow:
            0 11px 29px rgba(255,
                90,
                10,
                0.22);
    }

    .bf-enpl-bubble-gift {
        font-size: 24px;
        line-height: 1;
    }

    .bf-enpl-bubble-text {
        font-size: 9px;
        line-height: 1.1;

        font-weight: 800;

        text-align: center;
    }


    /* Bubble accent ring */
    .bf-enpl-bubble::after {
        content: "";

        position: absolute;

        inset: -6px;

        border:
            1px solid rgba(255,
                90,
                10,
                .18);

        border-radius: inherit;

        pointer-events: none;
    }


    /* =========================
   MOBILE
========================= */
@media (max-width: 600px) {

        .bf-enpl-panel {
            width:
                min(410px,
                    94vw);
            border-radius: 15px;
        }

        .bf-enpl-inner {
            padding:
                24px 18px 18px;
        }

        .bf-enpl-title {
            font-size: 27px;
            letter-spacing: -1px;
        }

        .bf-enpl-subtitle {
            font-size: 14px;
            margin-bottom: 20px;
        }

        .bf-enpl-payment-card {
            min-height: 92px;

            padding:
                13px 7px;
        }

        .bf-enpl-percent {
            font-size: 30px;
        }

        .bf-enpl-pay-label {
            font-size: 10.5px;
        }

        .bf-enpl-pay-small {
            font-size: 9px;
        }

        .bf-enpl-payment {
            grid-template-columns:
                1fr 36px 1fr;
        }

        .bf-enpl-arrow-circle {
            width: 33px;
            height: 33px;

            font-size: 19px;
        }

        .bf-enpl-contact-item {
            min-height: 46px;

            /* Bigger on mobile too */
            font-size: 11px;
        }

        .bf-enpl-bubble {
            width: 68px;
            height: 68px;

            left: 16px;
            bottom: 18px;
        }

        .bf-enpl-bubble-gift {
            font-size: 20px;
        }

        .bf-enpl-bubble-text {
            font-size: 8px;
        }
}


/* =========================
   TABLET
========================= */
@media (min-width: 601px) and (max-width: 1024px) {

    .bf-enpl-contact {
        margin-top: 12px;
    }
}


/* =========================
   SHORT DESKTOP SCREENS
========================= */
    @media (max-height: 760px) and (min-width: 601px) {

        .bf-enpl-inner {
            padding-top: 26px;
            padding-bottom: 18px;
        }

        .bf-enpl-badge {
            margin-bottom: 13px;
        }

        .bf-enpl-title {
            font-size: 35px;
        }

        .bf-enpl-subtitle {
            margin-bottom: 16px;

            font-size: 14px;
        }

        .bf-enpl-payment {
            margin-bottom: 16px;
        }

        .bf-enpl-payment-card {
            min-height: 96px;
        }

        .bf-enpl-percent {
            font-size: 35px;
        }

        .bf-enpl-cta {
            min-height: 49px;
        }
    }


    /* =========================
   ACCESSIBILITY
========================= */
    @media (prefers-reduced-motion: reduce) {

        .bf-enpl-panel,
        .bf-enpl-overlay,
        .bf-enpl-bubble {
            transition: none;
        }
    }

/* ==================== services.html ==================== */

/* ---- services.html block 1 ---- */
#bfSiteHeader .bf-main {
                    height: var(--bf-main-height) !important;
                    min-height: var(--bf-main-height) !important;
                    padding: 0 !important;
                }

                #bfSiteHeader .bf-main-shell {
                    height: var(--bf-main-height) !important;
                    padding-top: 0 !important;
                    padding-bottom: 0 !important;
                }

                .page-sections:empty {
                    display: none !important;
                    height: 0 !important;
                    min-height: 0 !important;
                    margin: 0 !important;
                    padding: 0 !important;
                }

/* ---- services.html block 2 ---- */
@import url('https://fonts.googleapis.com/css2?family=Mako&family=Muli:wght@300;400;500;600;700;800;900&family=Source+Sans+Pro:wght@300;400;600;700;900&display=swap');

h1,
.source-sans {
  font-family: 'Source Sans Pro', sans-serif;
}

h2,
.mako {
  font-family: 'Mako', sans-serif;
}

p,
.muli {
  font-family: 'Muli', sans-serif;
}
        /* Banner Section Styles */
        .banner {
            position: relative;
            background-image: url('assets/images/home/latestproject/Akums At CPHI Frankfurt 2025.png'); /* Replace with your image path */
            background-size: cover;
            background-position: center;
            height: 55vh; /* Use full viewport height */
            color: white;
            display: flex;
            justify-content: center;
            align-items: center;
            text-align: center;
            padding: 0 20px; /* Padding to prevent text from touching the edges on mobile */
        }
        
        .banner::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.6); /* Adds a dark overlay */
        }
        
        .banner-content {
            position: relative;
            z-index: 1;
            max-width: 1200px; /* Limits the content width for larger screens */
            margin: 0 auto;
            padding: 20px;
        }
        
        .banner h1 {
            font-size: 2.5vw; /* Responsive font sizing */
            font-weight: 700;
            text-transform: capitalize;
            line-height: 1.2;
        }
        
        .banner .btn {
            font-size: 1.2vw; /* Responsive font size for buttons */
            padding: 12px 30px;
            margin: 10px;
            border-radius: 50px;
        }
        
        .btn-quote {
            background-color: transparent;
            border: 2px solid #fff;
            color: #fff;
        }
        
        .btn-quote:hover {
            background-color: #fff;
            color: #000;
            transition: 0.3s ease;
        }
        
        .btn-work {
            background-color: #C6E8E7;
            color: black;
        }
        
        .btn-work:hover {
            background-color: #F9C3C3;
            transition: 0.3s ease;
            color: black;
        }
        
        .highlight {
            color: var(--bf-primary); /* Change to the desired color */
        }
        
        .highlight-city {
            color: #00ccff; /* Change to the desired color */
        }

        /*service cards*/
        .expert-services{
          padding:70px 20px;
        }
        
        .services-grid{
          max-width:1200px;
          margin:auto;
          display:grid;
          grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
          gap:30px;
        }
        
        .service-card{
          background: white;
          border-radius:18px;
          padding:20px;
          position:relative;
          box-shadow:0 8px 25px rgba(0,0,0,0.08);
        }
        
        .service-card img{
          width:100%;
          height:270px;
          object-fit:cover;
          border-radius:14px;
        }
        
        .service-tag{
          display:inline-block;
          background:#00A3A1;
          color:#fff;
          padding:12px 12px;
          border-radius:6px;
          font-size:16px;
          font-weight:700;
          margin:15px 0 10px;
          width: 100%;
          text-align: center;
        }
        
        /* Hover effect */
        .service-tag:hover{
          background:#FF5733; /* darker shade */
          color:#ffffff !important;
        }
        
        .service-card p{
          font-size:14px;
          line-height:1.6;
          color: #070c1f;
          font-weight: 500;
        }
        
        
        /* Border colors */
        .service-card.blue{
          border:2px solid #00A3A1;
        }
        
        .service-card.red{
          border:2px solid #FF5733;
        }
        
        .service-card.cyan{
          border:2px solid #00A3A1;
        }
        
        
        /* Tablet Devices */
        @media (max-width: 1024px) {
            .banner h1 {
                font-size: 5vw;
            }
        
            .banner .btn {
                font-size: 2.3vw;
                padding: 12px 30px;
            }
        
            .banner-content {
                padding: 6px;
            }
        }

        @media (max-width: 768px) {
            .banner {
                height: auto;
                padding: 40px 20px;
            }
        
            /* H1 smaller for mobile */
            .banner h1 {
                font-size: 5.2vw;  /* पहले 6vw tha, ab halka chhota */
                line-height: 1.3;
                margin-bottom: 18px;
            }
        
            /* Buttons center + equal spacing + better size */
            .banner .button-group {
                display: flex;
                justify-content: center;
                flex-wrap: wrap;
                margin-top: 10px;
            }
        
            .banner .btn {
                font-size: 14px;     /* Chhota clean button size */
                padding: 8px 20px;   /* Compact mobile padding */
                border-radius: 40px;
            }
            
            .service-card img {
                height:250px;
              }
        }

/* ---- services.html block 3 ---- */
.bf-footer {
    position: relative;
    background: var(--bf-dark);
    color: #c7cbcd;
    font-family: Arial, Helvetica, sans-serif;
    overflow: hidden;
    padding: 24px 38px 0;
  }

  .bf-footer * {
    box-sizing: border-box;
  }

  .bf-footer a {
    color: #c7cbcd;
    text-decoration: none;
    transition: 0.25s ease;
  }

  .bf-footer a:hover {
    color: #F15A24;
  }

  .bf-footer-wrap {
    max-width: 1500px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1.15fr 1.6fr 1fr;
    gap: 40px;
  }

  .bf-footer h3 {
    margin: 0 0 8px;
    font-size: 21px;
    line-height: 1.15;
    font-weight: 700;
    color: #c7cbcd;
    letter-spacing: 0.2px;
  }

  .bf-line {
    width: 90px;
    height: 2px;
    margin-bottom: 17px;
    background: linear-gradient(to right, #006B60 78%, #F15A24 78%);
  }

  .bf-cert-logo img {
    width: 255px;
    max-width: 100%;
    display: block;
    background: #fff;
  }

  .bf-social-title {
    margin-top: 50px !important;
  }

  .bf-sub-title {
    margin-top: 20px !important;
  }

  .bf-social {
    display: flex;
    gap: 14px;
    align-items: center;
    flex-wrap: wrap;
  }

  .bf-social a {
    width: 37px;
    height: 37px;
    border-radius: 50%;
    color: #fff;
    font-size: 17px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
  }

  .bf-social a:hover {
    transform: translateY(-3px);
    color: #fff;
  }

  .bf-social .whatsapp {
    background: #25D366;
  }

  .bf-social .facebook {
    background: #1877F2;
  }

  .bf-social .instagram {
    background: radial-gradient(circle at 30% 30%, #feda75, #d62976, #962fbf, #4f5bd5);
  }

  .bf-social .linkedin {
    background: #0A66C2;
  }

  .bf-social .youtube {
    background: #FF0000;
  }

  .bf-list,
  .bf-contact {
    padding: 0;
    margin: 0;
    list-style: none;
  }

  .bf-list li,
  .bf-contact li {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 9px;
    font-size: 15px;
    line-height: 1.32;
    color: #c7cbcd;
  }

  .bf-list span,
  .bf-contact span {
    width: 27px;
    min-width: 27px;
    height: 27px;
    border-radius: 50%;
    background: #006B60;
    color: #fff;
    font-size: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .bf-list li:hover span,
  .bf-contact li:hover span {
    background: #F15A24;
  }

  .bf-location {
    display: grid;
    grid-template-columns: 21px 1fr;
    gap: 12px;
    margin-bottom: 16px;
  }

  .bf-location>i {
    color: #F15A24;
    font-size: 19px;
    margin-top: 3px;
  }

  .bf-location strong {
    display: block;
    font-size: 15.8px;
    margin-bottom: 3px;
    color: #c7cbcd;
  }

  .bf-location p {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.35;
    color: #c7cbcd;
  }

  .bf-location a {
    display: block;
    color: #c7cbcd;
    text-decoration: none;
    word-break: normal;
    overflow-wrap: break-word;
  }

  .bf-location a:hover {
    color: #F15A24;
  }

  .bf-contact li {
    margin-bottom: 16px;
  }

  .bf-contact a {
    font-size: 15px;
  }

  .bf-copy {
    max-width: 1500px;
    margin: 18px auto 0;
    padding: 12px 10px;
    border-top: 1px solid rgba(0, 107, 96, 0.60);
    text-align: center;
    font-size: 14.5px;
    line-height: 1.35;
    color: #c7cbcd;
  }

  .bf-copy a {
    color: #F15A24;
    font-weight: 700;
  }

  .bf-copy a:hover {
    color: #000;
  }

  /* Sticky WhatsApp Chat Widget */
  .bf-chat-widget {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 9999;
    font-family: Arial, Helvetica, sans-serif;
  }

  .bf-chat-box {
    position: absolute;
    right: 0;
    bottom: 78px;
    width: 315px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition: all 0.3s ease;
    pointer-events: none;
  }

  .bf-chat-box.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
  }

  .bf-chat-message {
    width: 100%;
    background: #ffffff;
    color: #222222;
    padding: 14px 16px;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.4;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.16);
  }

  .bf-chat-option {
    background: #ffffff;
    color: #128C7E !important;
    text-decoration: none;
    padding: 10px 16px;
    border-radius: 7px;
    font-size: 13.5px;
    line-height: 1.2;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.14);
    transition: 0.25s ease;
    text-align: right;
  }

  .bf-chat-option:hover {
    background: #25D366;
    color: #ffffff !important;
    transform: translateY(-2px);
  }

  .bf-chat-button {
    position: relative;
    width: 58px;
    height: 58px;
    border: none;
    outline: none;
    border-radius: 50%;
    background: #25D366;
    color: #ffffff !important;
    font-size: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 8px 26px rgba(37, 211, 102, 0.35);
    transition: 0.25s ease;
    text-decoration: none;
  }

  .bf-chat-button:hover {
    background: #128C7E;
    color: #ffffff !important;
    transform: scale(1.06);
  }

  .bf-chat-badge {
    position: absolute;
    top: -5px;
    right: -3px;
    width: 21px;
    height: 21px;
    background: #ff3b30;
    color: #ffffff;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* Small pulse effect */
  .bf-chat-button::after {
    content: "";
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    border: 2px solid rgba(37, 211, 102, 0.45);
    animation: bfPulse 1.8s infinite;
  }

  @keyframes bfPulse {
    0% {
      transform: scale(0.95);
      opacity: 0.8;
    }

    100% {
      transform: scale(1.25);
      opacity: 0;
    }
  }

  @media (max-width: 767px) {
    .bf-chat-widget {
      right: 16px;
      bottom: 18px;
    }

    .bf-chat-box {
      width: 270px;
      bottom: 72px;
    }

    .bf-chat-button {
      width: 54px;
      height: 54px;
      font-size: 28px;
    }
  }

  /* Floating Call Icon */
  .custom-call-icon {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
    transition: transform 0.3s ease;
  }

  .custom-call-icon img {
    width: 50px;
    height: auto;
  }

  .custom-call-icon:hover {
    transform: scale(1.1);
  }

  @media (min-width: 768px) {
    .custom-call-icon {
      display: none;
    }
  }

  @media (max-width: 1200px) {
    .bf-footer-wrap {
      grid-template-columns: repeat(2, 1fr);
      gap: 32px 42px;
    }

    .bf-social-title {
      margin-top: 32px !important;
    }
  }

  @media (max-width: 768px) {
    .bf-footer {
      padding: 25px 22px 0;
    }

    .bf-footer-wrap {
      grid-template-columns: 1fr;
      gap: 30px;
    }

    .bf-footer h3 {
      font-size: 20px;
    }

    .bf-cert-logo img {
      width: 230px;
    }

    .bf-social-title,
    .bf-sub-title {
      margin-top: 24px !important;
    }

  }

  @media (max-width: 480px) {
    .bf-social a {
      width: 35px;
      height: 35px;
      font-size: 15px;
    }

    .bf-list li,
    .bf-contact li,
    .bf-location p {
      font-size: 14px;
    }

  }

/* ---- services.html block 4 ---- */
/* =========================
   BF PAY LATER - VARIABLES
========================= */
    :root {
        --bf-offer-orange: var(--bf-primary-dark);
        --bf-offer-orange-dark: #e64c00;
        --bf-offer-navy: #10243d;
        --bf-offer-text: #1e293b;
        --bf-offer-muted: #64748b;
        --bf-offer-border: #e6e9ee;
        --bf-offer-white: #ffffff;
        --bf-offer-green: #16803d;
    }


    /* =========================
   PAGE OVERLAY
========================= */
    .bf-enpl-overlay {
        position: fixed;
        inset: 0;
        background: rgba(5, 15, 28, 0.38);
        z-index: 99997;

        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        transition:
            opacity 0.30s ease,
            visibility 0.30s ease;
    }

    .bf-enpl-overlay.is-visible {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }


    /* =========================
   POPUP PANEL
========================= */
    .bf-enpl-panel {
        position: fixed;
        top: 50%;
        left: 50%;

        width: min(440px, calc(100vw - 32px));
        max-height: calc(100dvh - 32px);

        background: var(--bf-offer-white);
        z-index: 99999;

        transform: translate(-50%, -48%) scale(.96);

        transition:
            opacity 0.28s ease,
            visibility 0.28s ease,
            transform 0.32s cubic-bezier(.22, .8, .26, 1);

        box-shadow:
            0 24px 70px rgba(0, 0, 0, 0.22);

        font-family:
            "Poppins",
            "Inter",
            Arial,
            Helvetica,
            sans-serif;

        display: flex;
        flex-direction: column;

        overflow-y: auto;
        overscroll-behavior: contain;
        border-radius: 18px;

        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        /* Helps browser isolate popup rendering */
        contain: layout paint;
    }

    .bf-enpl-panel.is-open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translate(-50%, -50%) scale(1);
    }


    /* =========================
   INNER
========================= */
    .bf-enpl-inner {
        width: 100%;

        padding: 28px 28px 22px;

        display: flex;
        flex-direction: column;
    }


    /* =========================
   CLOSE BUTTON
========================= */
    .bf-enpl-close {
        position: absolute;

        top: 14px;
        right: 14px;

        width: 40px;
        height: 40px;

        display: grid;
        place-items: center;

        border: 0;

        background: transparent;
        color: #253242;

        cursor: pointer;

        font-size: 30px;
        font-weight: 300;
        line-height: 1;

        border-radius: 50%;

        transition:
            background 0.2s ease,
            transform 0.2s ease;
    }

    .bf-enpl-close:hover {
        background: #f3f4f6;
        transform: rotate(5deg);
    }


    /* =========================
   OFFER BADGE
========================= */
    .bf-enpl-badge {
        display: inline-flex;
        align-items: center;

        gap: 8px;

        width: fit-content;

        padding: 8px 13px;

        margin:
            0 42px 16px 0;

        border-radius: 100px;

        background: #fff4ee;
        color: #a73b00;

        font-size: 13px;
        line-height: 1;
        font-weight: 700;
    }

    .bf-enpl-flag {
        position: relative;
        width: 20px;
        height: 14px;
        display: inline-block;
        flex: 0 0 20px;
        overflow: hidden;
        border: 1px solid rgba(167, 59, 0, 0.18);
        border-radius: 2px;
        background:
            linear-gradient(
                to bottom,
                var(--bf-primary) 0 33.33%,
                #ffffff 33.33% 66.66%,
                #138808 66.66% 100%
            );
    }

    .bf-enpl-flag::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        width: 5px;
        height: 5px;
        border: 1px solid #000080;
        border-radius: 50%;
        transform: translate(-50%, -50%);
    }


    /* =========================
   HEADLINE
========================= */
    .bf-enpl-title {
        margin: 0 0 9px;

        color: var(--bf-offer-navy);

        font-size: 34px;

        line-height: 1.08;

        letter-spacing: -1.4px;

        font-weight: 800;
        white-space: nowrap;
    }

    .bf-enpl-title-highlight {
        color: var(--bf-offer-orange);
    }


    /* =========================
   OFFER LINE
========================= */
    .bf-enpl-subtitle {
        margin: 0 0 18px;

        color: #384354;

        font-size: 15px;
        line-height: 1.45;
        font-weight: 500;
    }

    .bf-enpl-subtitle strong {
        color: var(--bf-offer-navy);
        font-weight: 800;
    }


    /* =========================
   15 / 85 PAYMENT CARD
========================= */
    .bf-enpl-payment {
        display: grid;

        grid-template-columns:
            1fr 44px 1fr;

        align-items: stretch;

        margin-bottom: 18px;
    }

    .bf-enpl-payment-card {
        min-height: 102px;

        display: flex;
        flex-direction: column;

        align-items: center;
        justify-content: center;

        padding: 16px 10px;

        border-radius: 9px;
        overflow: hidden;
    }

    .bf-enpl-payment-card:first-child {
        background:
            linear-gradient(135deg,
                #f0faf2 0%,
                #e9f7ee 100%);
    }

    .bf-enpl-payment-card:last-child {
        background:
            linear-gradient(135deg,
                #f1f6fd 0%,
                #edf4fc 100%);
    }

    .bf-enpl-percent {
        margin-bottom: 6px;

        font-size: 36px;
        line-height: 1;

        font-weight: 800;
    }

    .bf-enpl-payment-card:first-child .bf-enpl-percent {
        color: #126b3d;
    }

    .bf-enpl-payment-card:last-child .bf-enpl-percent {
        color: #124b86;
    }

    .bf-enpl-pay-label {
        color: var(--bf-offer-navy);

        font-size: 12px;
        line-height: 1.15;

        font-weight: 800;

        text-align: center;
        white-space: nowrap;
    }

    .bf-enpl-pay-small {
        margin-top: 6px;

        color: #4c5967;

        font-size: 10px;
        line-height: 1.2;

        text-align: center;
    }


    /* =========================
   PAYMENT ARROW
========================= */
    .bf-enpl-payment-arrow {
        display: flex;

        justify-content: center;
        align-items: center;
    }

    .bf-enpl-arrow-circle {
        width: 39px;
        height: 39px;

        display: grid;
        place-items: center;

        border:
            1px solid var(--bf-primary-light);

        border-radius: 50%;

        background: #fff;

        color:
            var(--bf-offer-navy);

        font-size: 23px;

        box-shadow:
            0 5px 15px rgba(20,
                35,
                55,
                0.08);
    }


    /* =========================
   CTA
========================= */
    .bf-enpl-cta {
        width: 100%;
        min-height: 52px;

        display: flex;

        align-items: center;
        justify-content: center;

        gap: 10px;

        padding:
            15px 22px;

        margin-bottom: 14px;

        border: 0;
        border-radius: 7px;

        background:
            linear-gradient(90deg,
                var(--bf-offer-orange) 0%,
                var(--bf-primary-dark) 100%);

        color: white;

        font-size: 16px;
        line-height: 1;

        font-weight: 750;

        text-decoration: none;

        cursor: pointer;

        box-shadow:
            0 10px 25px rgba(255,
                90,
                10,
                0.22);

        transition:
            transform 0.2s ease,
            box-shadow 0.2s ease,
            background 0.2s ease;
    }

    .bf-enpl-cta:hover {
        color: #fff;

        transform:
            translateY(-2px);

        box-shadow:
            0 14px 28px rgba(255,
                90,
                10,
                0.30);

        background:
            linear-gradient(90deg,
                #e94e00 0%,
                var(--bf-primary-dark) 100%);
    }

    .bf-enpl-cta-arrow {
        font-size: 21px;
    }


    /* =========================
   CONTACT DETAILS
========================= */
    .bf-enpl-contact {
        display: grid;

        grid-template-columns:
            1fr 1.35fr;

        gap: 0;

        margin-top: 0;
        margin-bottom: 12px;

        border:
            1px solid #e6e9ed;

        border-radius: 8px;

        background: #fff;
    }


    /*
   UPDATED:
   Bigger phone + email
*/
    .bf-enpl-contact-item {
        min-height: 54px;

        display: flex;

        align-items: center;

        gap: 9px;

        padding:
            12px 11px;

        color: #263443;

        font-size: 12px;
        line-height: 1.3;

        font-weight: 600;

        text-decoration: none;

        overflow-wrap: anywhere;
    }

    .bf-enpl-contact-item:first-child {
        border-right:
            1px solid #e6e9ed;
    }

    .bf-enpl-contact-item:hover {
        color:
            var(--bf-offer-orange);
    }


    /*
   UPDATED:
   Slightly bigger icon
*/
    .bf-enpl-contact-icon {
        color:
            var(--bf-offer-navy);

        font-size: 18px;

        flex-shrink: 0;
    }


    /* =========================
   TERMS
========================= */
    .bf-enpl-terms {
        margin: 0;

        color: #7a838e;

        font-size: 9px;
        line-height: 1.5;

        text-align: center;
    }


    /* =========================
   OFFER BUBBLE
========================= */
    .bf-enpl-bubble {
        position: fixed;

        left: 24px;
        bottom: 24px;

        z-index: 99996;

        width: 82px;
        height: 82px;

        display: flex;
        flex-direction: column;

        align-items: center;
        justify-content: center;

        gap: 3px;

        padding: 5px;

        border:
            2px solid var(--bf-primary-light);

        border-radius: 50%;

        background: #fff;

        color:
            var(--bf-offer-orange);

        cursor: pointer;

        opacity: 0;
        visibility: hidden;

        transform:
            scale(.8);

        box-shadow:
            0 7px 24px rgba(19,
                32,
                45,
                0.16);

        transition:
            opacity .25s ease,
            visibility .25s ease,
            transform .25s ease,
            box-shadow .25s ease;

        font-family:
            "Poppins",
            Arial,
            sans-serif;
    }

    .bf-enpl-bubble.is-visible {
        opacity: 1;
        visibility: visible;

        transform:
            scale(1);
    }

    .bf-enpl-bubble:hover {
        transform:
            scale(1.06);

        box-shadow:
            0 11px 29px rgba(255,
                90,
                10,
                0.22);
    }

    .bf-enpl-bubble-gift {
        font-size: 24px;
        line-height: 1;
    }

    .bf-enpl-bubble-text {
        font-size: 9px;
        line-height: 1.1;

        font-weight: 800;

        text-align: center;
    }


    /* Bubble accent ring */
    .bf-enpl-bubble::after {
        content: "";

        position: absolute;

        inset: -6px;

        border:
            1px solid rgba(255,
                90,
                10,
                .18);

        border-radius: inherit;

        pointer-events: none;
    }


    /* =========================
   MOBILE
========================= */
@media (max-width: 600px) {

        .bf-enpl-panel {
            width:
                min(410px,
                    94vw);
            border-radius: 15px;
        }

        .bf-enpl-inner {
            padding:
                24px 18px 18px;
        }

        .bf-enpl-title {
            font-size: 27px;
            letter-spacing: -1px;
        }

        .bf-enpl-subtitle {
            font-size: 14px;
            margin-bottom: 20px;
        }

        .bf-enpl-payment-card {
            min-height: 92px;

            padding:
                13px 7px;
        }

        .bf-enpl-percent {
            font-size: 30px;
        }

        .bf-enpl-pay-label {
            font-size: 10.5px;
        }

        .bf-enpl-pay-small {
            font-size: 9px;
        }

        .bf-enpl-payment {
            grid-template-columns:
                1fr 36px 1fr;
        }

        .bf-enpl-arrow-circle {
            width: 33px;
            height: 33px;

            font-size: 19px;
        }

        .bf-enpl-contact-item {
            min-height: 46px;

            /* Bigger on mobile too */
            font-size: 11px;
        }

        .bf-enpl-bubble {
            width: 68px;
            height: 68px;

            left: 16px;
            bottom: 18px;
        }

        .bf-enpl-bubble-gift {
            font-size: 20px;
        }

        .bf-enpl-bubble-text {
            font-size: 8px;
        }
}


/* =========================
   TABLET
========================= */
@media (min-width: 601px) and (max-width: 1024px) {

    .bf-enpl-contact {
        margin-top: 12px;
    }
}


/* =========================
   SHORT DESKTOP SCREENS
========================= */
    @media (max-height: 760px) and (min-width: 601px) {

        .bf-enpl-inner {
            padding-top: 26px;
            padding-bottom: 18px;
        }

        .bf-enpl-badge {
            margin-bottom: 13px;
        }

        .bf-enpl-title {
            font-size: 35px;
        }

        .bf-enpl-subtitle {
            margin-bottom: 16px;

            font-size: 14px;
        }

        .bf-enpl-payment {
            margin-bottom: 16px;
        }

        .bf-enpl-payment-card {
            min-height: 96px;
        }

        .bf-enpl-percent {
            font-size: 35px;
        }

        .bf-enpl-cta {
            min-height: 49px;
        }
    }


    /* =========================
   ACCESSIBILITY
========================= */
    @media (prefers-reduced-motion: reduce) {

        .bf-enpl-panel,
        .bf-enpl-overlay,
        .bf-enpl-bubble {
            transition: none;
        }
    }

/* ==================== privacy-policy.html ==================== */

/* ---- privacy-policy.html block 1 ---- */
#bfSiteHeader .bf-main {
                    height: var(--bf-main-height) !important;
                    min-height: var(--bf-main-height) !important;
                    padding: 0 !important;
                }

                #bfSiteHeader .bf-main-shell {
                    height: var(--bf-main-height) !important;
                    padding-top: 0 !important;
                    padding-bottom: 0 !important;
                }

                .page-sections:empty {
                    display: none !important;
                    height: 0 !important;
                    min-height: 0 !important;
                    margin: 0 !important;
                    padding: 0 !important;
                }

/* ---- privacy-policy.html block 2 ---- */
h1 {
            color: #000;
            font-size: 32px;
        }
    
        h2 {
            color: #000;
            border-bottom: 1px solid #ddd;
            padding-bottom: 10px;
            font-size: 22px;
        }
    
        p {
            margin-bottom: 15px;
            font-size: 17px;
        }
    
        .privacy a {
            color: #1268AF;
            text-decoration: none;
        }
    
        a:hover {
            text-decoration: none;
        }
    
        /* Desktop Padding */
        .privacy {
            padding: 140px 100px 70px 90px;
        }
    
        .privacy ul {
            margin-bottom: 25px; /* jitna chaho utna bada kar sakte ho */
        }

        
        /* Tablet View */
        @media (max-width: 768px) {
            .privacy {
                padding: 100px 40px 80px 40px;
            }
    
            h1 {
                font-size: 26px;
            }
    
            h2 {
                font-size: 20px;
            }
        }
    
        /* Mobile View */
        @media (max-width: 480px) {
            .privacy {
                padding: 100px 15px 60px 30px;
            }
    
            h1 {
                font-size: 24px;
            }
    
            p {
                font-size: 16px;
            }
        }

/* ---- privacy-policy.html block 3 ---- */
.bf-footer {
    position: relative;
    background: var(--bf-dark);
    color: #c7cbcd;
    font-family: Arial, Helvetica, sans-serif;
    overflow: hidden;
    padding: 24px 38px 0;
  }

  .bf-footer * {
    box-sizing: border-box;
  }

  .bf-footer a {
    color: #c7cbcd;
    text-decoration: none;
    transition: 0.25s ease;
  }

  .bf-footer a:hover {
    color: #F15A24;
  }

  .bf-footer-wrap {
    max-width: 1500px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1.15fr 1.6fr 1fr;
    gap: 40px;
  }

  .bf-footer h3 {
    margin: 0 0 8px;
    font-size: 21px;
    line-height: 1.15;
    font-weight: 700;
    color: #c7cbcd;
    letter-spacing: 0.2px;
  }

  .bf-line {
    width: 90px;
    height: 2px;
    margin-bottom: 17px;
    background: linear-gradient(to right, #006B60 78%, #F15A24 78%);
  }

  .bf-cert-logo img {
    width: 255px;
    max-width: 100%;
    display: block;
    background: #fff;
  }

  .bf-social-title {
    margin-top: 50px !important;
  }

  .bf-sub-title {
    margin-top: 20px !important;
  }

  .bf-social {
    display: flex;
    gap: 14px;
    align-items: center;
    flex-wrap: wrap;
  }

  .bf-social a {
    width: 37px;
    height: 37px;
    border-radius: 50%;
    color: #fff;
    font-size: 17px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
  }

  .bf-social a:hover {
    transform: translateY(-3px);
    color: #fff;
  }

  .bf-social .whatsapp {
    background: #25D366;
  }

  .bf-social .facebook {
    background: #1877F2;
  }

  .bf-social .instagram {
    background: radial-gradient(circle at 30% 30%, #feda75, #d62976, #962fbf, #4f5bd5);
  }

  .bf-social .linkedin {
    background: #0A66C2;
  }

  .bf-social .youtube {
    background: #FF0000;
  }

  .bf-list,
  .bf-contact {
    padding: 0;
    margin: 0;
    list-style: none;
  }

  .bf-list li,
  .bf-contact li {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 9px;
    font-size: 15px;
    line-height: 1.32;
    color: #c7cbcd;
  }

  .bf-list span,
  .bf-contact span {
    width: 27px;
    min-width: 27px;
    height: 27px;
    border-radius: 50%;
    background: #006B60;
    color: #fff;
    font-size: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .bf-list li:hover span,
  .bf-contact li:hover span {
    background: #F15A24;
  }

  .bf-location {
    display: grid;
    grid-template-columns: 21px 1fr;
    gap: 12px;
    margin-bottom: 16px;
  }

  .bf-location>i {
    color: #F15A24;
    font-size: 19px;
    margin-top: 3px;
  }

  .bf-location strong {
    display: block;
    font-size: 15.8px;
    margin-bottom: 3px;
    color: #c7cbcd;
  }

  .bf-location p {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.35;
    color: #c7cbcd;
  }

  .bf-location a {
    display: block;
    color: #c7cbcd;
    text-decoration: none;
    word-break: normal;
    overflow-wrap: break-word;
  }

  .bf-location a:hover {
    color: #F15A24;
  }

  .bf-contact li {
    margin-bottom: 16px;
  }

  .bf-contact a {
    font-size: 15px;
  }

  .bf-copy {
    max-width: 1500px;
    margin: 18px auto 0;
    padding: 12px 10px;
    border-top: 1px solid rgba(0, 107, 96, 0.60);
    text-align: center;
    font-size: 14.5px;
    line-height: 1.35;
    color: #c7cbcd;
  }

  .bf-copy a {
    color: #F15A24;
    font-weight: 700;
  }

  .bf-copy a:hover {
    color: #000;
  }

  /* Sticky WhatsApp Chat Widget */
  .bf-chat-widget {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 9999;
    font-family: Arial, Helvetica, sans-serif;
  }

  .bf-chat-box {
    position: absolute;
    right: 0;
    bottom: 78px;
    width: 315px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition: all 0.3s ease;
    pointer-events: none;
  }

  .bf-chat-box.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
  }

  .bf-chat-message {
    width: 100%;
    background: #ffffff;
    color: #222222;
    padding: 14px 16px;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.4;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.16);
  }

  .bf-chat-option {
    background: #ffffff;
    color: #128C7E !important;
    text-decoration: none;
    padding: 10px 16px;
    border-radius: 7px;
    font-size: 13.5px;
    line-height: 1.2;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.14);
    transition: 0.25s ease;
    text-align: right;
  }

  .bf-chat-option:hover {
    background: #25D366;
    color: #ffffff !important;
    transform: translateY(-2px);
  }

  .bf-chat-button {
    position: relative;
    width: 58px;
    height: 58px;
    border: none;
    outline: none;
    border-radius: 50%;
    background: #25D366;
    color: #ffffff !important;
    font-size: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 8px 26px rgba(37, 211, 102, 0.35);
    transition: 0.25s ease;
    text-decoration: none;
  }

  .bf-chat-button:hover {
    background: #128C7E;
    color: #ffffff !important;
    transform: scale(1.06);
  }

  .bf-chat-badge {
    position: absolute;
    top: -5px;
    right: -3px;
    width: 21px;
    height: 21px;
    background: #ff3b30;
    color: #ffffff;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* Small pulse effect */
  .bf-chat-button::after {
    content: "";
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    border: 2px solid rgba(37, 211, 102, 0.45);
    animation: bfPulse 1.8s infinite;
  }

  @keyframes bfPulse {
    0% {
      transform: scale(0.95);
      opacity: 0.8;
    }

    100% {
      transform: scale(1.25);
      opacity: 0;
    }
  }

  @media (max-width: 767px) {
    .bf-chat-widget {
      right: 16px;
      bottom: 18px;
    }

    .bf-chat-box {
      width: 270px;
      bottom: 72px;
    }

    .bf-chat-button {
      width: 54px;
      height: 54px;
      font-size: 28px;
    }
  }

  /* Floating Call Icon */
  .custom-call-icon {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
    transition: transform 0.3s ease;
  }

  .custom-call-icon img {
    width: 50px;
    height: auto;
  }

  .custom-call-icon:hover {
    transform: scale(1.1);
  }

  @media (min-width: 768px) {
    .custom-call-icon {
      display: none;
    }
  }

  @media (max-width: 1200px) {
    .bf-footer-wrap {
      grid-template-columns: repeat(2, 1fr);
      gap: 32px 42px;
    }

    .bf-social-title {
      margin-top: 32px !important;
    }
  }

  @media (max-width: 768px) {
    .bf-footer {
      padding: 25px 22px 0;
    }

    .bf-footer-wrap {
      grid-template-columns: 1fr;
      gap: 30px;
    }

    .bf-footer h3 {
      font-size: 20px;
    }

    .bf-cert-logo img {
      width: 230px;
    }

    .bf-social-title,
    .bf-sub-title {
      margin-top: 24px !important;
    }

  }

  @media (max-width: 480px) {
    .bf-social a {
      width: 35px;
      height: 35px;
      font-size: 15px;
    }

    .bf-list li,
    .bf-contact li,
    .bf-location p {
      font-size: 14px;
    }

  }

/* ---- privacy-policy.html block 4 ---- */
/* =========================
   BF PAY LATER - VARIABLES
========================= */
    :root {
        --bf-offer-orange: var(--bf-primary-dark);
        --bf-offer-orange-dark: #e64c00;
        --bf-offer-navy: #10243d;
        --bf-offer-text: #1e293b;
        --bf-offer-muted: #64748b;
        --bf-offer-border: #e6e9ee;
        --bf-offer-white: #ffffff;
        --bf-offer-green: #16803d;
    }


    /* =========================
   PAGE OVERLAY
========================= */
    .bf-enpl-overlay {
        position: fixed;
        inset: 0;
        background: rgba(5, 15, 28, 0.38);
        z-index: 99997;

        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        transition:
            opacity 0.30s ease,
            visibility 0.30s ease;
    }

    .bf-enpl-overlay.is-visible {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }


    /* =========================
   POPUP PANEL
========================= */
    .bf-enpl-panel {
        position: fixed;
        top: 50%;
        left: 50%;

        width: min(440px, calc(100vw - 32px));
        max-height: calc(100dvh - 32px);

        background: var(--bf-offer-white);
        z-index: 99999;

        transform: translate(-50%, -48%) scale(.96);

        transition:
            opacity 0.28s ease,
            visibility 0.28s ease,
            transform 0.32s cubic-bezier(.22, .8, .26, 1);

        box-shadow:
            0 24px 70px rgba(0, 0, 0, 0.22);

        font-family:
            "Poppins",
            "Inter",
            Arial,
            Helvetica,
            sans-serif;

        display: flex;
        flex-direction: column;

        overflow-y: auto;
        overscroll-behavior: contain;
        border-radius: 18px;

        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        /* Helps browser isolate popup rendering */
        contain: layout paint;
    }

    .bf-enpl-panel.is-open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translate(-50%, -50%) scale(1);
    }


    /* =========================
   INNER
========================= */
    .bf-enpl-inner {
        width: 100%;

        padding: 28px 28px 22px;

        display: flex;
        flex-direction: column;
    }


    /* =========================
   CLOSE BUTTON
========================= */
    .bf-enpl-close {
        position: absolute;

        top: 14px;
        right: 14px;

        width: 40px;
        height: 40px;

        display: grid;
        place-items: center;

        border: 0;

        background: transparent;
        color: #253242;

        cursor: pointer;

        font-size: 30px;
        font-weight: 300;
        line-height: 1;

        border-radius: 50%;

        transition:
            background 0.2s ease,
            transform 0.2s ease;
    }

    .bf-enpl-close:hover {
        background: #f3f4f6;
        transform: rotate(5deg);
    }


    /* =========================
   OFFER BADGE
========================= */
    .bf-enpl-badge {
        display: inline-flex;
        align-items: center;

        gap: 8px;

        width: fit-content;

        padding: 8px 13px;

        margin:
            0 42px 16px 0;

        border-radius: 100px;

        background: #fff4ee;
        color: #a73b00;

        font-size: 13px;
        line-height: 1;
        font-weight: 700;
    }

    .bf-enpl-flag {
        position: relative;
        width: 20px;
        height: 14px;
        display: inline-block;
        flex: 0 0 20px;
        overflow: hidden;
        border: 1px solid rgba(167, 59, 0, 0.18);
        border-radius: 2px;
        background:
            linear-gradient(
                to bottom,
                var(--bf-primary) 0 33.33%,
                #ffffff 33.33% 66.66%,
                #138808 66.66% 100%
            );
    }

    .bf-enpl-flag::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        width: 5px;
        height: 5px;
        border: 1px solid #000080;
        border-radius: 50%;
        transform: translate(-50%, -50%);
    }


    /* =========================
   HEADLINE
========================= */
    .bf-enpl-title {
        margin: 0 0 9px;

        color: var(--bf-offer-navy);

        font-size: 34px;

        line-height: 1.08;

        letter-spacing: -1.4px;

        font-weight: 800;
        white-space: nowrap;
    }

    .bf-enpl-title-highlight {
        color: var(--bf-offer-orange);
    }


    /* =========================
   OFFER LINE
========================= */
    .bf-enpl-subtitle {
        margin: 0 0 18px;

        color: #384354;

        font-size: 15px;
        line-height: 1.45;
        font-weight: 500;
    }

    .bf-enpl-subtitle strong {
        color: var(--bf-offer-navy);
        font-weight: 800;
    }


    /* =========================
   15 / 85 PAYMENT CARD
========================= */
    .bf-enpl-payment {
        display: grid;

        grid-template-columns:
            1fr 44px 1fr;

        align-items: stretch;

        margin-bottom: 18px;
    }

    .bf-enpl-payment-card {
        min-height: 102px;

        display: flex;
        flex-direction: column;

        align-items: center;
        justify-content: center;

        padding: 16px 10px;

        border-radius: 9px;
        overflow: hidden;
    }

    .bf-enpl-payment-card:first-child {
        background:
            linear-gradient(135deg,
                #f0faf2 0%,
                #e9f7ee 100%);
    }

    .bf-enpl-payment-card:last-child {
        background:
            linear-gradient(135deg,
                #f1f6fd 0%,
                #edf4fc 100%);
    }

    .bf-enpl-percent {
        margin-bottom: 6px;

        font-size: 36px;
        line-height: 1;

        font-weight: 800;
    }

    .bf-enpl-payment-card:first-child .bf-enpl-percent {
        color: #126b3d;
    }

    .bf-enpl-payment-card:last-child .bf-enpl-percent {
        color: #124b86;
    }

    .bf-enpl-pay-label {
        color: var(--bf-offer-navy);

        font-size: 12px;
        line-height: 1.15;

        font-weight: 800;

        text-align: center;
        white-space: nowrap;
    }

    .bf-enpl-pay-small {
        margin-top: 6px;

        color: #4c5967;

        font-size: 10px;
        line-height: 1.2;

        text-align: center;
    }


    /* =========================
   PAYMENT ARROW
========================= */
    .bf-enpl-payment-arrow {
        display: flex;

        justify-content: center;
        align-items: center;
    }

    .bf-enpl-arrow-circle {
        width: 39px;
        height: 39px;

        display: grid;
        place-items: center;

        border:
            1px solid var(--bf-primary-light);

        border-radius: 50%;

        background: #fff;

        color:
            var(--bf-offer-navy);

        font-size: 23px;

        box-shadow:
            0 5px 15px rgba(20,
                35,
                55,
                0.08);
    }


    /* =========================
   CTA
========================= */
    .bf-enpl-cta {
        width: 100%;
        min-height: 52px;

        display: flex;

        align-items: center;
        justify-content: center;

        gap: 10px;

        padding:
            15px 22px;

        margin-bottom: 14px;

        border: 0;
        border-radius: 7px;

        background:
            linear-gradient(90deg,
                var(--bf-offer-orange) 0%,
                var(--bf-primary-dark) 100%);

        color: white;

        font-size: 16px;
        line-height: 1;

        font-weight: 750;

        text-decoration: none;

        cursor: pointer;

        box-shadow:
            0 10px 25px rgba(255,
                90,
                10,
                0.22);

        transition:
            transform 0.2s ease,
            box-shadow 0.2s ease,
            background 0.2s ease;
    }

    .bf-enpl-cta:hover {
        color: #fff;

        transform:
            translateY(-2px);

        box-shadow:
            0 14px 28px rgba(255,
                90,
                10,
                0.30);

        background:
            linear-gradient(90deg,
                #e94e00 0%,
                var(--bf-primary-dark) 100%);
    }

    .bf-enpl-cta-arrow {
        font-size: 21px;
    }


    /* =========================
   CONTACT DETAILS
========================= */
    .bf-enpl-contact {
        display: grid;

        grid-template-columns:
            1fr 1.35fr;

        gap: 0;

        margin-top: 0;
        margin-bottom: 12px;

        border:
            1px solid #e6e9ed;

        border-radius: 8px;

        background: #fff;
    }


    /*
   UPDATED:
   Bigger phone + email
*/
    .bf-enpl-contact-item {
        min-height: 54px;

        display: flex;

        align-items: center;

        gap: 9px;

        padding:
            12px 11px;

        color: #263443;

        font-size: 12px;
        line-height: 1.3;

        font-weight: 600;

        text-decoration: none;

        overflow-wrap: anywhere;
    }

    .bf-enpl-contact-item:first-child {
        border-right:
            1px solid #e6e9ed;
    }

    .bf-enpl-contact-item:hover {
        color:
            var(--bf-offer-orange);
    }


    /*
   UPDATED:
   Slightly bigger icon
*/
    .bf-enpl-contact-icon {
        color:
            var(--bf-offer-navy);

        font-size: 18px;

        flex-shrink: 0;
    }


    /* =========================
   TERMS
========================= */
    .bf-enpl-terms {
        margin: 0;

        color: #7a838e;

        font-size: 9px;
        line-height: 1.5;

        text-align: center;
    }


    /* =========================
   OFFER BUBBLE
========================= */
    .bf-enpl-bubble {
        position: fixed;

        left: 24px;
        bottom: 24px;

        z-index: 99996;

        width: 82px;
        height: 82px;

        display: flex;
        flex-direction: column;

        align-items: center;
        justify-content: center;

        gap: 3px;

        padding: 5px;

        border:
            2px solid var(--bf-primary-light);

        border-radius: 50%;

        background: #fff;

        color:
            var(--bf-offer-orange);

        cursor: pointer;

        opacity: 0;
        visibility: hidden;

        transform:
            scale(.8);

        box-shadow:
            0 7px 24px rgba(19,
                32,
                45,
                0.16);

        transition:
            opacity .25s ease,
            visibility .25s ease,
            transform .25s ease,
            box-shadow .25s ease;

        font-family:
            "Poppins",
            Arial,
            sans-serif;
    }

    .bf-enpl-bubble.is-visible {
        opacity: 1;
        visibility: visible;

        transform:
            scale(1);
    }

    .bf-enpl-bubble:hover {
        transform:
            scale(1.06);

        box-shadow:
            0 11px 29px rgba(255,
                90,
                10,
                0.22);
    }

    .bf-enpl-bubble-gift {
        font-size: 24px;
        line-height: 1;
    }

    .bf-enpl-bubble-text {
        font-size: 9px;
        line-height: 1.1;

        font-weight: 800;

        text-align: center;
    }


    /* Bubble accent ring */
    .bf-enpl-bubble::after {
        content: "";

        position: absolute;

        inset: -6px;

        border:
            1px solid rgba(255,
                90,
                10,
                .18);

        border-radius: inherit;

        pointer-events: none;
    }


    /* =========================
   MOBILE
========================= */
@media (max-width: 600px) {

        .bf-enpl-panel {
            width:
                min(410px,
                    94vw);
            border-radius: 15px;
        }

        .bf-enpl-inner {
            padding:
                24px 18px 18px;
        }

        .bf-enpl-title {
            font-size: 27px;
            letter-spacing: -1px;
        }

        .bf-enpl-subtitle {
            font-size: 14px;
            margin-bottom: 20px;
        }

        .bf-enpl-payment-card {
            min-height: 92px;

            padding:
                13px 7px;
        }

        .bf-enpl-percent {
            font-size: 30px;
        }

        .bf-enpl-pay-label {
            font-size: 10.5px;
        }

        .bf-enpl-pay-small {
            font-size: 9px;
        }

        .bf-enpl-payment {
            grid-template-columns:
                1fr 36px 1fr;
        }

        .bf-enpl-arrow-circle {
            width: 33px;
            height: 33px;

            font-size: 19px;
        }

        .bf-enpl-contact-item {
            min-height: 46px;

            /* Bigger on mobile too */
            font-size: 11px;
        }

        .bf-enpl-bubble {
            width: 68px;
            height: 68px;

            left: 16px;
            bottom: 18px;
        }

        .bf-enpl-bubble-gift {
            font-size: 20px;
        }

        .bf-enpl-bubble-text {
            font-size: 8px;
        }
}


/* =========================
   TABLET
========================= */
@media (min-width: 601px) and (max-width: 1024px) {

    .bf-enpl-contact {
        margin-top: 12px;
    }
}


/* =========================
   SHORT DESKTOP SCREENS
========================= */
    @media (max-height: 760px) and (min-width: 601px) {

        .bf-enpl-inner {
            padding-top: 26px;
            padding-bottom: 18px;
        }

        .bf-enpl-badge {
            margin-bottom: 13px;
        }

        .bf-enpl-title {
            font-size: 35px;
        }

        .bf-enpl-subtitle {
            margin-bottom: 16px;

            font-size: 14px;
        }

        .bf-enpl-payment {
            margin-bottom: 16px;
        }

        .bf-enpl-payment-card {
            min-height: 96px;
        }

        .bf-enpl-percent {
            font-size: 35px;
        }

        .bf-enpl-cta {
            min-height: 49px;
        }
    }


    /* =========================
   ACCESSIBILITY
========================= */
    @media (prefers-reduced-motion: reduce) {

        .bf-enpl-panel,
        .bf-enpl-overlay,
        .bf-enpl-bubble {
            transition: none;
        }
    }

/* ==================== terms-&-conditions.html ==================== */

/* ---- terms-&-conditions.html block 1 ---- */
#bfSiteHeader .bf-main {
                    height: var(--bf-main-height) !important;
                    min-height: var(--bf-main-height) !important;
                    padding: 0 !important;
                }

                #bfSiteHeader .bf-main-shell {
                    height: var(--bf-main-height) !important;
                    padding-top: 0 !important;
                    padding-bottom: 0 !important;
                }

                .page-sections:empty {
                    display: none !important;
                    height: 0 !important;
                    min-height: 0 !important;
                    margin: 0 !important;
                    padding: 0 !important;
                }

/* ---- terms-&-conditions.html block 2 ---- */
h1 {
        color: #000;
        font-size: 32px;
        margin-bottom: 20px;
    }

    h2 {
        color: #000;
        border-bottom: 1px solid #ddd;
        padding-bottom: 10px;
        margin-top: 30px;
        font-size: 22px;
    }

    p {
        margin-bottom: 15px;
        font-size: 17px;
    }

    .terms a {
        color: #1268AF;
        text-decoration: none;
    }

    .terms a:hover {
        text-decoration: none;
    }

    /* Desktop Padding */
    .terms {
        padding: 140px 100px 80px 100px;
    }
    
    .terms ul {
        margin-bottom: 25px;
    }

    /* Tablet View */
    @media (max-width: 768px) {
        .terms {
            padding: 130px 40px 70px 40px;
        }

        h1 {
            font-size: 28px;
        }

        h2 {
            font-size: 20px;
        }
    }

    /* Mobile View */
    @media (max-width: 480px) {
        .terms {
            padding: 150px 20px 60px 20px;
        }

        h1 {
            font-size: 24px;
        }

        p {
            font-size: 16px;
        }
    }

/* ---- terms-&-conditions.html block 3 ---- */
.bf-footer {
    position: relative;
    background: var(--bf-dark);
    color: #c7cbcd;
    font-family: Arial, Helvetica, sans-serif;
    overflow: hidden;
    padding: 24px 38px 0;
  }

  .bf-footer * {
    box-sizing: border-box;
  }

  .bf-footer a {
    color: #c7cbcd;
    text-decoration: none;
    transition: 0.25s ease;
  }

  .bf-footer a:hover {
    color: #F15A24;
  }

  .bf-footer-wrap {
    max-width: 1500px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1.15fr 1.6fr 1fr;
    gap: 40px;
  }

  .bf-footer h3 {
    margin: 0 0 8px;
    font-size: 21px;
    line-height: 1.15;
    font-weight: 700;
    color: #c7cbcd;
    letter-spacing: 0.2px;
  }

  .bf-line {
    width: 90px;
    height: 2px;
    margin-bottom: 17px;
    background: linear-gradient(to right, #006B60 78%, #F15A24 78%);
  }

  .bf-cert-logo img {
    width: 255px;
    max-width: 100%;
    display: block;
    background: #fff;
  }

  .bf-social-title {
    margin-top: 50px !important;
  }

  .bf-sub-title {
    margin-top: 20px !important;
  }

  .bf-social {
    display: flex;
    gap: 14px;
    align-items: center;
    flex-wrap: wrap;
  }

  .bf-social a {
    width: 37px;
    height: 37px;
    border-radius: 50%;
    color: #fff;
    font-size: 17px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
  }

  .bf-social a:hover {
    transform: translateY(-3px);
    color: #fff;
  }

  .bf-social .whatsapp {
    background: #25D366;
  }

  .bf-social .facebook {
    background: #1877F2;
  }

  .bf-social .instagram {
    background: radial-gradient(circle at 30% 30%, #feda75, #d62976, #962fbf, #4f5bd5);
  }

  .bf-social .linkedin {
    background: #0A66C2;
  }

  .bf-social .youtube {
    background: #FF0000;
  }

  .bf-list,
  .bf-contact {
    padding: 0;
    margin: 0;
    list-style: none;
  }

  .bf-list li,
  .bf-contact li {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 9px;
    font-size: 15px;
    line-height: 1.32;
    color: #c7cbcd;
  }

  .bf-list span,
  .bf-contact span {
    width: 27px;
    min-width: 27px;
    height: 27px;
    border-radius: 50%;
    background: #006B60;
    color: #fff;
    font-size: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .bf-list li:hover span,
  .bf-contact li:hover span {
    background: #F15A24;
  }

  .bf-location {
    display: grid;
    grid-template-columns: 21px 1fr;
    gap: 12px;
    margin-bottom: 16px;
  }

  .bf-location>i {
    color: #F15A24;
    font-size: 19px;
    margin-top: 3px;
  }

  .bf-location strong {
    display: block;
    font-size: 15.8px;
    margin-bottom: 3px;
    color: #c7cbcd;
  }

  .bf-location p {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.35;
    color: #c7cbcd;
  }

  .bf-location a {
    display: block;
    color: #c7cbcd;
    text-decoration: none;
    word-break: normal;
    overflow-wrap: break-word;
  }

  .bf-location a:hover {
    color: #F15A24;
  }

  .bf-contact li {
    margin-bottom: 16px;
  }

  .bf-contact a {
    font-size: 15px;
  }

  .bf-copy {
    max-width: 1500px;
    margin: 18px auto 0;
    padding: 12px 10px;
    border-top: 1px solid rgba(0, 107, 96, 0.60);
    text-align: center;
    font-size: 14.5px;
    line-height: 1.35;
    color: #c7cbcd;
  }

  .bf-copy a {
    color: #F15A24;
    font-weight: 700;
  }

  .bf-copy a:hover {
    color: #000;
  }

  /* Sticky WhatsApp Chat Widget */
  .bf-chat-widget {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 9999;
    font-family: Arial, Helvetica, sans-serif;
  }

  .bf-chat-box {
    position: absolute;
    right: 0;
    bottom: 78px;
    width: 315px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition: all 0.3s ease;
    pointer-events: none;
  }

  .bf-chat-box.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
  }

  .bf-chat-message {
    width: 100%;
    background: #ffffff;
    color: #222222;
    padding: 14px 16px;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.4;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.16);
  }

  .bf-chat-option {
    background: #ffffff;
    color: #128C7E !important;
    text-decoration: none;
    padding: 10px 16px;
    border-radius: 7px;
    font-size: 13.5px;
    line-height: 1.2;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.14);
    transition: 0.25s ease;
    text-align: right;
  }

  .bf-chat-option:hover {
    background: #25D366;
    color: #ffffff !important;
    transform: translateY(-2px);
  }

  .bf-chat-button {
    position: relative;
    width: 58px;
    height: 58px;
    border: none;
    outline: none;
    border-radius: 50%;
    background: #25D366;
    color: #ffffff !important;
    font-size: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 8px 26px rgba(37, 211, 102, 0.35);
    transition: 0.25s ease;
    text-decoration: none;
  }

  .bf-chat-button:hover {
    background: #128C7E;
    color: #ffffff !important;
    transform: scale(1.06);
  }

  .bf-chat-badge {
    position: absolute;
    top: -5px;
    right: -3px;
    width: 21px;
    height: 21px;
    background: #ff3b30;
    color: #ffffff;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* Small pulse effect */
  .bf-chat-button::after {
    content: "";
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    border: 2px solid rgba(37, 211, 102, 0.45);
    animation: bfPulse 1.8s infinite;
  }

  @keyframes bfPulse {
    0% {
      transform: scale(0.95);
      opacity: 0.8;
    }

    100% {
      transform: scale(1.25);
      opacity: 0;
    }
  }

  @media (max-width: 767px) {
    .bf-chat-widget {
      right: 16px;
      bottom: 18px;
    }

    .bf-chat-box {
      width: 270px;
      bottom: 72px;
    }

    .bf-chat-button {
      width: 54px;
      height: 54px;
      font-size: 28px;
    }
  }

  /* Floating Call Icon */
  .custom-call-icon {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
    transition: transform 0.3s ease;
  }

  .custom-call-icon img {
    width: 50px;
    height: auto;
  }

  .custom-call-icon:hover {
    transform: scale(1.1);
  }

  @media (min-width: 768px) {
    .custom-call-icon {
      display: none;
    }
  }

  @media (max-width: 1200px) {
    .bf-footer-wrap {
      grid-template-columns: repeat(2, 1fr);
      gap: 32px 42px;
    }

    .bf-social-title {
      margin-top: 32px !important;
    }
  }

  @media (max-width: 768px) {
    .bf-footer {
      padding: 25px 22px 0;
    }

    .bf-footer-wrap {
      grid-template-columns: 1fr;
      gap: 30px;
    }

    .bf-footer h3 {
      font-size: 20px;
    }

    .bf-cert-logo img {
      width: 230px;
    }

    .bf-social-title,
    .bf-sub-title {
      margin-top: 24px !important;
    }

  }

  @media (max-width: 480px) {
    .bf-social a {
      width: 35px;
      height: 35px;
      font-size: 15px;
    }

    .bf-list li,
    .bf-contact li,
    .bf-location p {
      font-size: 14px;
    }

  }

/* ---- terms-&-conditions.html block 4 ---- */
/* =========================
   BF PAY LATER - VARIABLES
========================= */
    :root {
        --bf-offer-orange: var(--bf-primary-dark);
        --bf-offer-orange-dark: #e64c00;
        --bf-offer-navy: #10243d;
        --bf-offer-text: #1e293b;
        --bf-offer-muted: #64748b;
        --bf-offer-border: #e6e9ee;
        --bf-offer-white: #ffffff;
        --bf-offer-green: #16803d;
    }


    /* =========================
   PAGE OVERLAY
========================= */
    .bf-enpl-overlay {
        position: fixed;
        inset: 0;
        background: rgba(5, 15, 28, 0.38);
        z-index: 99997;

        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        transition:
            opacity 0.30s ease,
            visibility 0.30s ease;
    }

    .bf-enpl-overlay.is-visible {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }


    /* =========================
   POPUP PANEL
========================= */
    .bf-enpl-panel {
        position: fixed;
        top: 50%;
        left: 50%;

        width: min(440px, calc(100vw - 32px));
        max-height: calc(100dvh - 32px);

        background: var(--bf-offer-white);
        z-index: 99999;

        transform: translate(-50%, -48%) scale(.96);

        transition:
            opacity 0.28s ease,
            visibility 0.28s ease,
            transform 0.32s cubic-bezier(.22, .8, .26, 1);

        box-shadow:
            0 24px 70px rgba(0, 0, 0, 0.22);

        font-family:
            "Poppins",
            "Inter",
            Arial,
            Helvetica,
            sans-serif;

        display: flex;
        flex-direction: column;

        overflow-y: auto;
        overscroll-behavior: contain;
        border-radius: 18px;

        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        /* Helps browser isolate popup rendering */
        contain: layout paint;
    }

    .bf-enpl-panel.is-open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translate(-50%, -50%) scale(1);
    }


    /* =========================
   INNER
========================= */
    .bf-enpl-inner {
        width: 100%;

        padding: 28px 28px 22px;

        display: flex;
        flex-direction: column;
    }


    /* =========================
   CLOSE BUTTON
========================= */
    .bf-enpl-close {
        position: absolute;

        top: 14px;
        right: 14px;

        width: 40px;
        height: 40px;

        display: grid;
        place-items: center;

        border: 0;

        background: transparent;
        color: #253242;

        cursor: pointer;

        font-size: 30px;
        font-weight: 300;
        line-height: 1;

        border-radius: 50%;

        transition:
            background 0.2s ease,
            transform 0.2s ease;
    }

    .bf-enpl-close:hover {
        background: #f3f4f6;
        transform: rotate(5deg);
    }


    /* =========================
   OFFER BADGE
========================= */
    .bf-enpl-badge {
        display: inline-flex;
        align-items: center;

        gap: 8px;

        width: fit-content;

        padding: 8px 13px;

        margin:
            0 42px 16px 0;

        border-radius: 100px;

        background: #fff4ee;
        color: #a73b00;

        font-size: 13px;
        line-height: 1;
        font-weight: 700;
    }

    .bf-enpl-flag {
        position: relative;
        width: 20px;
        height: 14px;
        display: inline-block;
        flex: 0 0 20px;
        overflow: hidden;
        border: 1px solid rgba(167, 59, 0, 0.18);
        border-radius: 2px;
        background:
            linear-gradient(
                to bottom,
                var(--bf-primary) 0 33.33%,
                #ffffff 33.33% 66.66%,
                #138808 66.66% 100%
            );
    }

    .bf-enpl-flag::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        width: 5px;
        height: 5px;
        border: 1px solid #000080;
        border-radius: 50%;
        transform: translate(-50%, -50%);
    }


    /* =========================
   HEADLINE
========================= */
    .bf-enpl-title {
        margin: 0 0 9px;

        color: var(--bf-offer-navy);

        font-size: 34px;

        line-height: 1.08;

        letter-spacing: -1.4px;

        font-weight: 800;
        white-space: nowrap;
    }

    .bf-enpl-title-highlight {
        color: var(--bf-offer-orange);
    }


    /* =========================
   OFFER LINE
========================= */
    .bf-enpl-subtitle {
        margin: 0 0 18px;

        color: #384354;

        font-size: 15px;
        line-height: 1.45;
        font-weight: 500;
    }

    .bf-enpl-subtitle strong {
        color: var(--bf-offer-navy);
        font-weight: 800;
    }


    /* =========================
   15 / 85 PAYMENT CARD
========================= */
    .bf-enpl-payment {
        display: grid;

        grid-template-columns:
            1fr 44px 1fr;

        align-items: stretch;

        margin-bottom: 18px;
    }

    .bf-enpl-payment-card {
        min-height: 102px;

        display: flex;
        flex-direction: column;

        align-items: center;
        justify-content: center;

        padding: 16px 10px;

        border-radius: 9px;
        overflow: hidden;
    }

    .bf-enpl-payment-card:first-child {
        background:
            linear-gradient(135deg,
                #f0faf2 0%,
                #e9f7ee 100%);
    }

    .bf-enpl-payment-card:last-child {
        background:
            linear-gradient(135deg,
                #f1f6fd 0%,
                #edf4fc 100%);
    }

    .bf-enpl-percent {
        margin-bottom: 6px;

        font-size: 36px;
        line-height: 1;

        font-weight: 800;
    }

    .bf-enpl-payment-card:first-child .bf-enpl-percent {
        color: #126b3d;
    }

    .bf-enpl-payment-card:last-child .bf-enpl-percent {
        color: #124b86;
    }

    .bf-enpl-pay-label {
        color: var(--bf-offer-navy);

        font-size: 12px;
        line-height: 1.15;

        font-weight: 800;

        text-align: center;
        white-space: nowrap;
    }

    .bf-enpl-pay-small {
        margin-top: 6px;

        color: #4c5967;

        font-size: 10px;
        line-height: 1.2;

        text-align: center;
    }


    /* =========================
   PAYMENT ARROW
========================= */
    .bf-enpl-payment-arrow {
        display: flex;

        justify-content: center;
        align-items: center;
    }

    .bf-enpl-arrow-circle {
        width: 39px;
        height: 39px;

        display: grid;
        place-items: center;

        border:
            1px solid var(--bf-primary-light);

        border-radius: 50%;

        background: #fff;

        color:
            var(--bf-offer-navy);

        font-size: 23px;

        box-shadow:
            0 5px 15px rgba(20,
                35,
                55,
                0.08);
    }


    /* =========================
   CTA
========================= */
    .bf-enpl-cta {
        width: 100%;
        min-height: 52px;

        display: flex;

        align-items: center;
        justify-content: center;

        gap: 10px;

        padding:
            15px 22px;

        margin-bottom: 14px;

        border: 0;
        border-radius: 7px;

        background:
            linear-gradient(90deg,
                var(--bf-offer-orange) 0%,
                var(--bf-primary-dark) 100%);

        color: white;

        font-size: 16px;
        line-height: 1;

        font-weight: 750;

        text-decoration: none;

        cursor: pointer;

        box-shadow:
            0 10px 25px rgba(255,
                90,
                10,
                0.22);

        transition:
            transform 0.2s ease,
            box-shadow 0.2s ease,
            background 0.2s ease;
    }

    .bf-enpl-cta:hover {
        color: #fff;

        transform:
            translateY(-2px);

        box-shadow:
            0 14px 28px rgba(255,
                90,
                10,
                0.30);

        background:
            linear-gradient(90deg,
                #e94e00 0%,
                var(--bf-primary-dark) 100%);
    }

    .bf-enpl-cta-arrow {
        font-size: 21px;
    }


    /* =========================
   CONTACT DETAILS
========================= */
    .bf-enpl-contact {
        display: grid;

        grid-template-columns:
            1fr 1.35fr;

        gap: 0;

        margin-top: 0;
        margin-bottom: 12px;

        border:
            1px solid #e6e9ed;

        border-radius: 8px;

        background: #fff;
    }


    /*
   UPDATED:
   Bigger phone + email
*/
    .bf-enpl-contact-item {
        min-height: 54px;

        display: flex;

        align-items: center;

        gap: 9px;

        padding:
            12px 11px;

        color: #263443;

        font-size: 12px;
        line-height: 1.3;

        font-weight: 600;

        text-decoration: none;

        overflow-wrap: anywhere;
    }

    .bf-enpl-contact-item:first-child {
        border-right:
            1px solid #e6e9ed;
    }

    .bf-enpl-contact-item:hover {
        color:
            var(--bf-offer-orange);
    }


    /*
   UPDATED:
   Slightly bigger icon
*/
    .bf-enpl-contact-icon {
        color:
            var(--bf-offer-navy);

        font-size: 18px;

        flex-shrink: 0;
    }


    /* =========================
   TERMS
========================= */
    .bf-enpl-terms {
        margin: 0;

        color: #7a838e;

        font-size: 9px;
        line-height: 1.5;

        text-align: center;
    }


    /* =========================
   OFFER BUBBLE
========================= */
    .bf-enpl-bubble {
        position: fixed;

        left: 24px;
        bottom: 24px;

        z-index: 99996;

        width: 82px;
        height: 82px;

        display: flex;
        flex-direction: column;

        align-items: center;
        justify-content: center;

        gap: 3px;

        padding: 5px;

        border:
            2px solid var(--bf-primary-light);

        border-radius: 50%;

        background: #fff;

        color:
            var(--bf-offer-orange);

        cursor: pointer;

        opacity: 0;
        visibility: hidden;

        transform:
            scale(.8);

        box-shadow:
            0 7px 24px rgba(19,
                32,
                45,
                0.16);

        transition:
            opacity .25s ease,
            visibility .25s ease,
            transform .25s ease,
            box-shadow .25s ease;

        font-family:
            "Poppins",
            Arial,
            sans-serif;
    }

    .bf-enpl-bubble.is-visible {
        opacity: 1;
        visibility: visible;

        transform:
            scale(1);
    }

    .bf-enpl-bubble:hover {
        transform:
            scale(1.06);

        box-shadow:
            0 11px 29px rgba(255,
                90,
                10,
                0.22);
    }

    .bf-enpl-bubble-gift {
        font-size: 24px;
        line-height: 1;
    }

    .bf-enpl-bubble-text {
        font-size: 9px;
        line-height: 1.1;

        font-weight: 800;

        text-align: center;
    }


    /* Bubble accent ring */
    .bf-enpl-bubble::after {
        content: "";

        position: absolute;

        inset: -6px;

        border:
            1px solid rgba(255,
                90,
                10,
                .18);

        border-radius: inherit;

        pointer-events: none;
    }


    /* =========================
   MOBILE
========================= */
@media (max-width: 600px) {

        .bf-enpl-panel {
            width:
                min(410px,
                    94vw);
            border-radius: 15px;
        }

        .bf-enpl-inner {
            padding:
                24px 18px 18px;
        }

        .bf-enpl-title {
            font-size: 27px;
            letter-spacing: -1px;
        }

        .bf-enpl-subtitle {
            font-size: 14px;
            margin-bottom: 20px;
        }

        .bf-enpl-payment-card {
            min-height: 92px;

            padding:
                13px 7px;
        }

        .bf-enpl-percent {
            font-size: 30px;
        }

        .bf-enpl-pay-label {
            font-size: 10.5px;
        }

        .bf-enpl-pay-small {
            font-size: 9px;
        }

        .bf-enpl-payment {
            grid-template-columns:
                1fr 36px 1fr;
        }

        .bf-enpl-arrow-circle {
            width: 33px;
            height: 33px;

            font-size: 19px;
        }

        .bf-enpl-contact-item {
            min-height: 46px;

            /* Bigger on mobile too */
            font-size: 11px;
        }

        .bf-enpl-bubble {
            width: 68px;
            height: 68px;

            left: 16px;
            bottom: 18px;
        }

        .bf-enpl-bubble-gift {
            font-size: 20px;
        }

        .bf-enpl-bubble-text {
            font-size: 8px;
        }
}


/* =========================
   TABLET
========================= */
@media (min-width: 601px) and (max-width: 1024px) {

    .bf-enpl-contact {
        margin-top: 12px;
    }
}


/* =========================
   SHORT DESKTOP SCREENS
========================= */
    @media (max-height: 760px) and (min-width: 601px) {

        .bf-enpl-inner {
            padding-top: 26px;
            padding-bottom: 18px;
        }

        .bf-enpl-badge {
            margin-bottom: 13px;
        }

        .bf-enpl-title {
            font-size: 35px;
        }

        .bf-enpl-subtitle {
            margin-bottom: 16px;

            font-size: 14px;
        }

        .bf-enpl-payment {
            margin-bottom: 16px;
        }

        .bf-enpl-payment-card {
            min-height: 96px;
        }

        .bf-enpl-percent {
            font-size: 35px;
        }

        .bf-enpl-cta {
            min-height: 49px;
        }
    }


    /* =========================
   ACCESSIBILITY
========================= */
    @media (prefers-reduced-motion: reduce) {

        .bf-enpl-panel,
        .bf-enpl-overlay,
        .bf-enpl-bubble {
            transition: none;
        }
    }
/* ==================== Footer logo & tagline ==================== */
.bf-footer-logo { display: block; margin-bottom: 16px; height: auto; max-width: 150px; }
.bf-footer-tagline { color: #9aa0a3; font-size: 13.5px; line-height: 1.55; margin: 0 0 28px; }

/* ==================== Top trust bar — match brand color ==================== */
#bfSiteHeader .bf-top {
    background: linear-gradient(90deg, var(--bf-primary-light), #ffffff 55%, var(--bf-primary-light));
}

/* ==================== About: By The Numbers ==================== */
.numbers-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; margin-top: 24px; }
.number-item { background: #f8fafa; border: 1px solid #eef1f1; border-radius: 12px; padding: 28px 16px; text-align: center; transition: transform 0.2s ease, box-shadow 0.2s ease; }
.number-item:hover { transform: translateY(-4px); box-shadow: 0 10px 24px rgba(0,0,0,0.06); border-color: var(--bf-primary-light); }
.number-item i { display: block; font-size: 26px; color: var(--bf-primary); margin-bottom: 12px; }
.number-item strong { display: block; font-size: 32px; font-weight: 800; color: var(--bf-dark); line-height: 1; margin-bottom: 8px; }
.number-item span { display: block; font-size: 13.5px; color: #666; line-height: 1.4; }
@media (max-width: 991px) { .numbers-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 600px) { .numbers-grid { grid-template-columns: repeat(2, 1fr); } }

/* ==================== About: Recent Projects ==================== */
.recent-projects-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 24px; }
.recent-project-card { position: relative; border-radius: 12px; overflow: hidden; aspect-ratio: 4/3; background: #eee; box-shadow: 0 6px 18px rgba(0,0,0,0.08); }
.recent-project-card img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.35s ease; }
.recent-project-card:hover img { transform: scale(1.06); }
.recent-project-overlay { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 16px; background: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,0.75) 100%); color: #fff; }
.recent-project-overlay h4 { margin: 0 0 2px; font-size: 15px; font-weight: 700; color: #fff; }
.recent-project-overlay p { margin: 0; font-size: 12.5px; color: #e6e6e6; }
.recent-projects-cta { text-align: center; margin-top: 20px; }
@media (max-width: 767px) { .recent-projects-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .recent-projects-grid { grid-template-columns: 1fr; } }

/* ==================== Services page — service cards (namespaced to avoid clashing with homepage .service-card) ==================== */
.svc-section { padding: 60px 20px 70px; background: #f8fafa; }
.svc-heading { text-align: center; max-width: 700px; margin: 0 auto 40px; }
.svc-grid { max-width: 1300px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 28px; }
.svc-card { background: #fff; border-radius: 16px; overflow: hidden; box-shadow: 0 8px 24px rgba(0,0,0,0.06); border: 1px solid #eef1f1; transition: transform 0.25s ease, box-shadow 0.25s ease; scroll-margin-top: 140px; }
.svc-card:hover { transform: translateY(-6px); box-shadow: 0 18px 36px rgba(0,0,0,0.10); }
.svc-card-media { position: relative; width: 100%; height: 190px; overflow: hidden; }
.svc-card-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.35s ease; }
.svc-card:hover .svc-card-media img { transform: scale(1.07); }
.svc-card-body { position: relative; padding: 34px 22px 24px; }
.svc-card-icon { position: absolute; top: -26px; left: 22px; width: 52px; height: 52px; border-radius: 50%; background: var(--bf-primary); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 20px; box-shadow: 0 6px 16px rgba(0,166,166,0.35); }
.svc-card-body h3 { margin: 0 0 10px; font-size: 18px; font-weight: 700; color: var(--bf-dark); }
.svc-card-body p { margin: 0; font-size: 14px; line-height: 1.6; color: #666; }
@media (max-width: 600px) { .svc-grid { grid-template-columns: 1fr; } }

/* ==================== Contact: center the Our Offices grid ==================== */
.offices-grid { grid-template-columns: repeat(auto-fit, minmax(280px, 340px)) !important; justify-content: center; }

/* ==================== About: Recent Projects section (full-width fix) ==================== */
.recent-projects-section { padding-top: 35px; padding-bottom: 35px; }
.recent-projects-card { background: #fff; border: 1px solid #e9e9e9; box-shadow: 0 12px 34px rgba(0,0,0,.08); padding: 32px; border-radius: 8px; }
.recent-projects-content { width: 100%; }
.recent-projects-cta { margin-top: 22px; }
.recent-projects-cta a { display: inline-flex; align-items: center; gap: 8px; background: var(--bf-primary); color: #fff !important; font-weight: 700; font-size: 14px; padding: 12px 22px; border-radius: 8px; text-decoration: none; transition: background 0.2s ease; }
.recent-projects-cta a:hover { background: var(--bf-primary-dark); }

/* ==================== Services page banner — legibility & brand buttons ==================== */
.banner-content h1 { color: #ffffff; text-shadow: 0 4px 18px rgba(0,0,0,0.5); }
.btn-work { background-color: var(--bf-primary) !important; color: #ffffff !important; }
.btn-work:hover { background-color: var(--bf-primary-dark) !important; }

/* ==================== Contact page hero (namespaced, replaces fragile legacy .pager-section) ==================== */
.cs-page-hero { position: relative; width: 100%; min-height: 220px; display: flex; align-items: center; background: linear-gradient(120deg, var(--bf-dark), #1f2a2e); padding: 60px 24px; }
.cs-page-hero-inner { max-width: 1200px; margin: 0 auto; width: 100%; }
.cs-breadcrumb { list-style: none; display: flex; gap: 8px; padding: 0; margin: 0 0 14px; font-size: 13.5px; color: #b8bfc2; }
.cs-breadcrumb li:not(:last-child)::after { content: '/'; margin-left: 8px; color: #6b7377; }
.cs-breadcrumb a { color: #b8bfc2; text-decoration: none; }
.cs-breadcrumb a:hover { color: var(--bf-primary-light); }
.cs-breadcrumb span { color: var(--bf-primary-light); }
.cs-page-hero h1 { margin: 0; color: #fff; font-size: 34px; font-weight: 800; }
@media (max-width: 600px) { .cs-page-hero { padding: 44px 20px; min-height: 170px; } .cs-page-hero h1 { font-size: 26px; } }

/* ==================== Footer social icon: Pinterest ==================== */
.bf-social .pinterest { background: #E60023; }

/* ==================== Portfolio card: stand-type badge ==================== */
.bf-type-badge { position: absolute; top: 10px; right: 10px; padding: 5px 10px; border-radius: 7px; background: var(--bf-primary); color: #fff; font-size: 10.5px; font-weight: 700; letter-spacing: 0.2px; }

/* ==================== Footer social icons: match header's flat style (no colored circles) ==================== */
.bf-footer .bf-social { display: flex; align-items: center; gap: 16px; }
.bf-footer .bf-social a,
.bf-footer .bf-social a.instagram,
.bf-footer .bf-social a.facebook,
.bf-footer .bf-social a.pinterest,
.bf-footer .bf-social a.linkedin,
.bf-footer .bf-social a.youtube {
    width: auto;
    height: auto;
    border-radius: 0;
    background: none;
    color: #c7cbcd;
    font-size: 18px;
    transition: color 0.18s ease, transform 0.18s ease;
}
.bf-footer .bf-social a:hover,
.bf-footer .bf-social a.instagram:hover,
.bf-footer .bf-social a.facebook:hover,
.bf-footer .bf-social a.pinterest:hover,
.bf-footer .bf-social a.linkedin:hover,
.bf-footer .bf-social a.youtube:hover {
    background: none;
    color: var(--bf-primary-light);
    transform: translateY(-2px);
}

/* ===============================
   SERVICE "LEARN MORE" POPUP MODAL
================================ */
.bf-service-modal { position: fixed; inset: 0; z-index: 99999; display: none; align-items: center; justify-content: center; padding: 20px; }
.bf-service-modal.is-open { display: flex; }
.bf-service-modal-backdrop { position: absolute; inset: 0; background: rgba(7, 12, 31, 0.82); }
.bf-service-modal-dialog { position: relative; z-index: 1; width: 100%; max-width: 780px; max-height: 88vh; overflow: auto; background: #fff; border-radius: 12px; display: grid; grid-template-columns: 1fr 1fr; box-shadow: 0 30px 70px rgba(0,0,0,0.4); }
.bf-service-modal-media { position: relative; min-height: 260px; background: #eee; }
.bf-service-modal-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bf-service-modal-body { padding: 32px 30px; display: flex; flex-direction: column; justify-content: center; }
.bf-service-modal-body h3 { margin: 0 0 14px; font-size: 24px; font-weight: 800; color: #101012; }
.bf-service-modal-body p { margin: 0 0 22px; font-size: 15px; line-height: 1.7; color: #515462; }
.bf-service-modal-btn { display: inline-flex; align-items: center; gap: 10px; align-self: flex-start; padding: 12px 22px; background: var(--bf-primary); color: #fff; border-radius: 6px; text-decoration: none; font-weight: 700; font-size: 14px; transition: background 0.25s ease; }
.bf-service-modal-btn:hover { background: var(--bf-primary-dark); color: #fff; }
.bf-service-modal-close { position: absolute; top: 12px; right: 14px; z-index: 2; width: 36px; height: 36px; border: none; border-radius: 50%; background: rgba(0,0,0,0.55); color: #fff; font-size: 22px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.bf-service-modal-close:hover { background: rgba(0,0,0,0.78); }
@media (max-width: 700px) {
    .bf-service-modal-dialog { grid-template-columns: 1fr; max-height: 92vh; }
    .bf-service-modal-media { min-height: 180px; }
    .bf-service-modal-body { padding: 24px 22px 28px; }
    .bf-service-modal-body h3 { font-size: 20px; }
}

/* ===============================
   INSTAGRAM FEED SECTION
================================ */
.bf-instagram-section { position: relative; left: 50%; width: 100vw; margin-left: -50vw; padding: 64px 20px 68px; background: linear-gradient(180deg, #0a0e1f 0%, #070c1f 100%); text-align: center; overflow: hidden; box-sizing: border-box; }
.bf-instagram-section * { box-sizing: border-box; }
.bf-instagram-heading { max-width: 720px; margin: 0 auto 30px; }
.bf-instagram-badge { display: inline-flex; align-items: center; gap: 8px; padding: 6px 16px; margin-bottom: 12px; border: 1px solid rgba(0, 166, 166, 0.5); border-radius: 30px; background: rgba(0, 166, 166, 0.12); color: #4dcfcf; font-size: 11px; font-weight: 800; letter-spacing: 3px; text-transform: uppercase; }
.bf-instagram-heading h2 { margin: 0 0 12px; color: #fff; font-size: 34px; line-height: 1.2; font-weight: 800; }
.bf-instagram-heading h2 span { color: var(--bf-primary-light); }
.bf-instagram-heading p { margin: 0; color: rgba(255,255,255,0.72); font-size: 15px; line-height: 1.7; }
.bf-instagram-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; max-width: 1300px; margin: 0 auto 30px; }
.bf-instagram-tile { position: relative; display: block; aspect-ratio: 1 / 1; border-radius: 8px; overflow: hidden; background: #10162e; }
.bf-instagram-tile img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.4s ease; }
.bf-instagram-tile:hover img { transform: scale(1.08); }
.bf-instagram-tile-overlay { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: linear-gradient(180deg, rgba(0,166,166,0.15), rgba(7,12,31,0.82)); color: #fff; font-size: 26px; opacity: 0; transition: opacity 0.3s ease; }
.bf-instagram-tile:hover .bf-instagram-tile-overlay { opacity: 1; }
.bf-instagram-follow-btn { display: inline-flex; align-items: center; gap: 10px; padding: 13px 28px; background: var(--bf-primary); color: #fff; border-radius: 6px; text-decoration: none; font-weight: 700; font-size: 14px; transition: background 0.25s ease, transform 0.25s ease; }
.bf-instagram-follow-btn:hover { background: var(--bf-primary-dark); color: #fff; transform: translateY(-2px); }
@media (max-width: 991px) { .bf-instagram-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 480px) { .bf-instagram-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; } .bf-instagram-heading h2 { font-size: 27px; } }