/*
Theme Name: BravoCrunch
Theme URI: https://bravocrunch.com
Author: ScoreTech Vision
Author URI: https://www.scoretechvision.com
Description: The BravoCrunch marketing theme (v3.0). Elementor-first: no hardcoded page layouts anywhere — every page, including Home, renders from database content. The theme provides only the site chrome (styled sticky header, footer, content templates) and defers to Elementor Theme Builder locations when present. All styling is scoped to theme chrome selectors (.bc-*) so it never fights Elementor's own widget styles.
Version: 4.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bravocrunch
*/

/* =============================================================================
   v3.0 CHANGE LOG (fixes for the issues reported on v2.0)
   1. front-page.php REMOVED — no content is hardcoded in theme templates.
      Home renders from the Home page's database content like every other page.
   2. Header rebuilt — no overflow/breakage with long menus: items wrap
      gracefully, a mobile toggle appears below 900px, and the fallback nav
      (when no menu is assigned) shows ONLY the 5 real pages.
   3. Every selector below is scoped under .bc-* (theme chrome) or the
      .bc-content wrapper — nothing global that could fight Elementor.
   ========================================================================== */

/* ---- Design tokens (theme chrome only) ---- */
:root {
  --bc-orange: #E8650F;
  --bc-orange-dark: #C4530A;
  --bc-ink: #3A3F46;
  --bc-ink-soft: #5A5F66;
  --bc-line: #E6E2DC;
  --bc-bg: #FFFFFF;
  --bc-bg-soft: #FAF8F5;
  --bc-radius: 10px;
  --bc-font-display: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --bc-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ---- Minimal, non-conflicting base (only what WordPress/Elementor expect) ---- */
html { box-sizing: border-box; -webkit-text-size-adjust: 100%; }
*, *::before, *::after { box-sizing: inherit; }
body { margin: 0; background: var(--bc-bg); }
img { max-width: 100%; height: auto; }

/* WordPress core alignment classes (required for wide/full support) */
.alignwide { margin-left: auto; margin-right: auto; max-width: 1200px; width: 100%; }
.alignfull { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); max-width: 100vw; width: 100vw; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.screen-reader-text {
  border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%);
  height: 1px; width: 1px; margin: -1px; overflow: hidden;
  padding: 0; position: absolute; word-wrap: normal !important;
}
.screen-reader-text:focus {
  background: var(--bc-bg); clip: auto !important; clip-path: none;
  color: var(--bc-ink); display: block; font-size: 14px; height: auto;
  left: 8px; top: 8px; padding: 12px 18px; width: auto; z-index: 100000;
  text-decoration: none;
}

/* =============================================================================
   HEADER (.bc-header) — sticky, overflow-safe
   ========================================================================== */
.bc-header {
  position: sticky; top: 0; z-index: 999;
  background: rgba(255,255,255,.96);
  backdrop-filter: saturate(1.2) blur(8px);
  border-bottom: 1px solid var(--bc-line);
}
.bc-header__inner {
  max-width: 1200px; margin: 0 auto; padding: 0 24px;
  min-height: 68px;
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
}
.bc-logo {
align-items: baseline; gap: 1px;
  font-family: var(--bc-font-display); font-weight: 700; font-size: 22px;
  text-decoration: none; line-height: 1; white-space: nowrap;
}
.bc-logo .b { color: var(--bc-ink); }
.bc-logo .m { color: var(--bc-orange); }
.bc-logo img { max-height: 30% !important; width: auto; }

/* Nav: flex with wrap so many items can NEVER break the header layout */
.bc-nav { display: flex; align-items: center; min-width: 0; }
.bc-nav ul {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; align-items: center;
  gap: 4px 6px; justify-content: flex-end;
}
.bc-nav li { margin: 0; padding: 0; position: relative; }
.bc-nav a {
  display: inline-block; padding: 8px 12px;
  font-family: var(--bc-font-body); font-size: 15px; font-weight: 500;
  color: var(--bc-ink); text-decoration: none; border-radius: 8px;
  white-space: nowrap; transition: background .15s ease, color .15s ease;
}
.bc-nav a:hover,
.bc-nav .current-menu-item > a,
.bc-nav .current_page_item > a { background: var(--bc-bg-soft); color: var(--bc-orange); }

/* Simple accessible dropdown for nested menu items (if the site ever uses them) */
.bc-nav li > ul {
  display: none; position: absolute; top: 100%; left: 0;
  min-width: 200px; background: #fff; border: 1px solid var(--bc-line);
  border-radius: var(--bc-radius); padding: 6px; box-shadow: 0 12px 30px rgba(58,63,70,.10);
  flex-direction: column; align-items: stretch;
}
.bc-nav li:hover > ul, .bc-nav li:focus-within > ul { display: flex; }
.bc-nav li > ul a { display: block; }

/* Mobile toggle */
.bc-nav-toggle {
  display: none; background: none; border: 1px solid var(--bc-line);
  border-radius: 8px; padding: 8px 12px; cursor: pointer;
  font-size: 18px; line-height: 1; color: var(--bc-ink);
}
@media (max-width: 900px) {
  .bc-nav-toggle { display: inline-flex; align-items: center; }
  .bc-nav {
    display: none; position: absolute; top: 100%; left: 0; right: 0;
    background: #fff; border-bottom: 1px solid var(--bc-line);
    padding: 8px 16px 16px; box-shadow: 0 16px 30px rgba(58,63,70,.08);
  }
  .bc-nav.is-open { display: block; }
  .bc-nav ul { flex-direction: column; align-items: stretch; gap: 2px; }
  .bc-nav a { display: block; padding: 12px 10px; }
  .bc-nav li > ul {
    display: block; position: static; border: 0; box-shadow: none;
    padding: 0 0 0 14px; min-width: 0;
  }
}

/* =============================================================================
   PAGE-TITLE HERO (used only on non-Elementor pages)
   ========================================================================== */
.bc-page-hero {
  background: linear-gradient(135deg, var(--bc-ink) 0%, #2A2E34 100%);
  padding: 56px 24px;
}
.bc-page-hero__inner { max-width: 1200px; margin: 0 auto; }
.bc-page-hero h1 {
  margin: 0; font-family: var(--bc-font-display);
  font-size: clamp(28px, 4vw, 42px); font-weight: 700; color: #fff; line-height: 1.15;
}
.bc-page-hero .bc-crumb {
  margin: 0 0 10px; font-family: var(--bc-font-body); font-size: 13px;
  letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.65);
}

/* =============================================================================
   CONTENT WRAPPER (.bc-content) — styles imported/typed content ONLY.
   Elementor-built pages never receive this wrapper, so nothing here can
   interfere with Elementor widgets.
   ========================================================================== */
.bc-content { max-width: 1200px; margin: 0 auto; padding: 48px 24px 72px; }
.bc-content, .bc-content p, .bc-content li {
  font-family: var(--bc-font-body); font-size: 17px; line-height: 1.7; color: var(--bc-ink-soft);
}
.bc-content h1, .bc-content h2, .bc-content h3, .bc-content h4 {
  font-family: var(--bc-font-display); color: var(--bc-ink); line-height: 1.25;
  margin: 1.6em 0 .5em;
}
.bc-content h1 { font-size: clamp(30px, 4vw, 44px); }
.bc-content h2 { font-size: clamp(24px, 3vw, 32px); }
.bc-content h3 { font-size: 22px; }
.bc-content a { color: var(--bc-orange); }
.bc-content a:hover { color: var(--bc-orange-dark); }
.bc-content blockquote {
  margin: 1.5em 0; padding: 4px 0 4px 20px;
  border-left: 3px solid var(--bc-orange); color: var(--bc-ink);
}
.bc-content .wp-block-button__link,
.bc-content .bc-btn {
  display: inline-block; background: var(--bc-orange); color: #fff;
  font-family: var(--bc-font-body); font-weight: 600; font-size: 16px;
  padding: 12px 26px; border-radius: 999px; text-decoration: none;
  transition: background .15s ease;
}
.bc-content .wp-block-button__link:hover,
.bc-content .bc-btn:hover { background: var(--bc-orange-dark); color: #fff; }
.bc-content table { border-collapse: collapse; width: 100%; }
.bc-content th, .bc-content td { border: 1px solid var(--bc-line); padding: 10px 14px; text-align: left; }
.bc-content th { background: var(--bc-bg-soft); color: var(--bc-ink); font-family: var(--bc-font-display); }

/* Blog cards on the posts index */
.bc-post-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 24px; }
.bc-post-card {
  border: 1px solid var(--bc-line); border-radius: var(--bc-radius);
  overflow: hidden; background: #fff; display: flex; flex-direction: column;
}
.bc-post-card__body { padding: 20px 22px 24px; }
.bc-post-card h2 { margin: 0 0 8px; font-size: 20px; }
.bc-post-card h2 a { color: var(--bc-ink); text-decoration: none; }
.bc-post-card h2 a:hover { color: var(--bc-orange); }
.bc-post-card .bc-meta { font-size: 13px; color: var(--bc-ink-soft); margin-bottom: 10px; }
.bc-post-card img { display: block; width: 100%; height: 190px; object-fit: cover; }

/* =============================================================================
   FOOTER (.bc-footer)
   ========================================================================== */
.bc-footer { background: var(--bc-ink); color: rgba(255,255,255,.78); margin-top: auto; }
.bc-footer__inner {
  max-width: 1200px; margin: 0 auto; padding: 56px 24px 28px;
  display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 40px;
}
.bc-footer h4 {
  margin: 0 0 14px; font-family: var(--bc-font-display); font-size: 15px;
  letter-spacing: .06em; text-transform: uppercase; color: #fff;
}
.bc-footer p, .bc-footer li { font-family: var(--bc-font-body); font-size: 15px; line-height: 1.7; }
.bc-footer ul { list-style: none; margin: 0; padding: 0; }
.bc-footer a { color: rgba(255,255,255,.78); text-decoration: none; }
.bc-footer a:hover { color: var(--bc-orange); }
.bc-footer .bc-logo .b { color: #fff; }
.bc-footer__bottom {
  border-top: 1px solid rgba(255,255,255,.12);
  max-width: 1200px; margin: 0 auto; padding: 18px 24px 26px;
  font-family: var(--bc-font-body); font-size: 13px; color: rgba(255,255,255,.5);
  display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap;
}
@media (max-width: 800px) { .bc-footer__inner { grid-template-columns: 1fr; gap: 28px; } }

/* Sticky-footer page frame */
.bc-frame { min-height: 100vh; display: flex; flex-direction: column; }
.bc-frame > .bc-main { flex: 1 0 auto; }

/* 404 */
.bc-404 { text-align: center; padding: 96px 24px; }
.bc-404 .code { font-family: var(--bc-font-display); font-size: 88px; font-weight: 700; color: var(--bc-orange); line-height: 1; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* =============================================================================
   v4.0 — PAGE DESIGN SYSTEM
   Used by the designed page templates (front-page.php, page-about.php,
   page-solutions.php, page-contact.php). Still fully scoped to .bc-* so
   Elementor-built pages (which bypass these templates' markup) are untouched.
   ========================================================================== */

.bc-eyebrow {
  font-family: var(--bc-font-body); font-size: 13px; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase; color: var(--bc-orange);
  margin: 0 0 14px;
}
.bc-section { padding: 84px 24px; }
.bc-section--soft { background: var(--bc-bg-soft); }
.bc-section--ink { background: linear-gradient(135deg, var(--bc-ink) 0%, #2A2E34 100%); }
.bc-section__inner { max-width: 1200px; margin: 0 auto; }

.bc-section h2 {
  font-family: var(--bc-font-display); font-size: clamp(26px, 3.4vw, 38px);
  color: var(--bc-ink); line-height: 1.2; margin: 0 0 14px;
}
.bc-section--ink h2, .bc-section--ink p { color: #fff; }
.bc-section .bc-lead {
  font-family: var(--bc-font-body); font-size: 18px; line-height: 1.7;
  color: var(--bc-ink-soft); max-width: 720px; margin: 0 0 40px;
}
.bc-section--ink .bc-lead { color: rgba(255,255,255,.8); }

/* Buttons */
.bc-btn, .bc-btn:visited {
  display: inline-block; background: var(--bc-orange); color: #fff;
  font-family: var(--bc-font-body); font-weight: 600; font-size: 16px;
  padding: 14px 30px; border-radius: 999px; text-decoration: none;
  transition: background .15s ease, transform .15s ease;
}
.bc-btn:hover { background: var(--bc-orange-dark); color: #fff; transform: translateY(-1px); }
.bc-btn--ghost, .bc-btn--ghost:visited {
  background: transparent; color: var(--bc-ink);
  border: 1.5px solid var(--bc-line);
}
.bc-btn--ghost:hover { background: var(--bc-bg-soft); color: var(--bc-orange); }
.bc-section--ink .bc-btn--ghost { color: #fff; border-color: rgba(255,255,255,.35); }
.bc-section--ink .bc-btn--ghost:hover { background: rgba(255,255,255,.08); color: #fff; }
.bc-btn-row { display: flex; gap: 14px; flex-wrap: wrap; }

/* HERO */
.bc-hero { background:
  radial-gradient(900px 420px at 85% -10%, rgba(232,101,15,.10), transparent 60%),
  linear-gradient(180deg, #FFFDFB 0%, var(--bc-bg-soft) 100%);
  border-bottom: 1px solid var(--bc-line);
  padding: 88px 24px 72px;
}
.bc-hero__inner {
  max-width: 1200px; margin: 0 auto;
  display: grid; grid-template-columns: 1.05fr .95fr; gap: 56px; 
}
.bc-hero__inner-pages{
    width:840px;
}
.bc-hero h1 {
  font-family: var(--bc-font-display); font-weight: 700;
  font-size: clamp(32px, 4.6vw, 52px); line-height: 1.12;
  color: var(--bc-ink); margin: 0 0 20px;
}
.bc-hero h1 em { font-style: normal; color: var(--bc-orange); }
.bc-hero .bc-lead { font-family: var(--bc-font-body); font-size: 17px; line-height: 1.7;
  color: var(--bc-ink-soft);margin-bottom: 32px; }
@media (max-width: 960px) { .bc-hero__inner { grid-template-columns: 1fr; gap: 40px; } }

/* Pure-CSS dashboard visual (no images to break) */

.bc-dash {
	background:transparent !important;
}
.bc-dash-inner img{
     background: #fff; border: 1px solid var(--bc-line); border-radius: 8px;
  box-shadow: 0 24px 60px rgba(58,63,70,.14);
}
.bc-dash-inner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
}
.bc-dash__bar {
  display: flex; align-items: center; gap: 6px;
  padding: 12px 16px; border-bottom: 1px solid var(--bc-line); background: var(--bc-bg-soft);
}
.bc-dash__bar i { width: 10px; height: 10px; border-radius: 50%; background: var(--bc-line); }
.bc-dash__bar i:first-child { background: var(--bc-orange); }
.bc-dash__body { display: grid; grid-template-columns: 150px 1fr; }
.bc-dash__nav { border-right: 1px solid var(--bc-line); padding: 16px 12px; display: grid; gap: 8px; }
.bc-dash__nav span { display: block; height: 10px; border-radius: 6px; background: var(--bc-bg-soft); }
.bc-dash__nav span.on { background: rgba(232,101,15,.25); }
.bc-dash__main { padding: 18px; display: grid; gap: 14px; }
.bc-dash__kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.bc-dash__kpi { border: 1px solid var(--bc-line); border-radius: 10px; padding: 12px; }
.bc-dash__kpi b { font-family: var(--bc-font-display); font-size: 20px; color: var(--bc-ink); display: block; }
.bc-dash__kpi small { color: var(--bc-ink-soft); font-size: 11px; }
.bc-dash__chart { display: flex; align-items: flex-end; gap: 8px; height: 110px;
  border: 1px solid var(--bc-line); border-radius: 10px; padding: 12px; }
.bc-dash__chart i { flex: 1; border-radius: 4px 4px 0 0; background: linear-gradient(180deg, var(--bc-orange), #F4A468); }
@media (max-width: 520px) { .bc-dash__body { grid-template-columns: 1fr; } .bc-dash__nav { display: none; } }

/* Card grids */
.bc-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.bc-card {
  background: #fff; border: 1px solid var(--bc-line); border-radius: var(--bc-radius);
  padding: 26px 24px;
}
.bc-card .ic {
  width: 44px; height: 44px; border-radius: 10px; display: flex; align-items: center;
  justify-content: center; font-size: 20px; margin-bottom: 16px;
  background: rgba(232,101,15,.12); color: var(--bc-orange);
}
.bc-card h3 { font-family: var(--bc-font-display); font-size: 19px; color: var(--bc-ink); margin: 0 0 8px; }
.bc-card p { font-family: var(--bc-font-body); font-size: 15px; line-height: 1.65; color: var(--bc-ink-soft); margin: 0; }

/* Numbered steps */
.bc-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 22px; counter-reset: step; }
.bc-step { position: relative; padding: 26px 24px 24px; background: #fff; border: 1px solid var(--bc-line); border-radius: var(--bc-radius); }
.bc-step::before {
  counter-increment: step; content: counter(step, decimal-leading-zero);
  font-family: var(--bc-font-display); font-weight: 700; font-size: 15px;
  color: var(--bc-orange); display: block; margin-bottom: 12px;
}
.bc-step h3 { font-family: var(--bc-font-display); font-size: 18px; color: var(--bc-ink); margin: 0 0 8px; }
.bc-step p { font-family: var(--bc-font-body); font-size: 15px; line-height: 1.65; color: var(--bc-ink-soft); margin: 0; }

/* Alternating split rows (Solutions) */
.bc-split { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; padding: 56px 0; border-bottom: 1px solid var(--bc-line); }
.bc-split:last-of-type { border-bottom: 0; }
.bc-split h3 { font-family: var(--bc-font-display); font-size: 26px; color: var(--bc-ink); margin: 0 0 12px; }
.bc-split p { font-family: var(--bc-font-body); font-size: 16px; line-height: 1.7; color: var(--bc-ink-soft); }
.bc-split ul { font-family: var(--bc-font-body); color: var(--bc-ink-soft); line-height: 1.9; padding-left: 20px; }
.bc-split--flip > :first-child { order: 2; }
.bc-tile {
  border-radius: 14px; border: 1px solid var(--bc-line);
  background: linear-gradient(145deg, var(--bc-bg-soft), #fff);
  min-height: 240px; display: flex; align-items: center; justify-content: center;
  font-size: 56px;
}
@media (max-width: 900px) { .bc-split { grid-template-columns: 1fr; gap: 24px; } .bc-split--flip > :first-child { order: 0; } }

/* CTA band */
.bc-cta { text-align: center; }
.bc-cta .bc-btn-row { justify-content: center; }

/* Contact layout */
.bc-contact { display: grid; grid-template-columns: .9fr 1.1fr; gap: 48px; }
.bc-contact__panel { background: #fff; border: 1px solid var(--bc-line); border-radius: var(--bc-radius); padding: 30px 30px 0px 30px; }
.bc-contact__panel label { display: block; font-family: var(--bc-font-body); font-weight: 600; font-size: 14px; color: var(--bc-ink); margin: 16px 0 6px; }
.bc-contact__panel p{
    font-family: var(--bc-font-body);
    font-size: 16px;
    color: var(--bc-ink-soft);
    line-height: 1.7;
}

.bc-contact__panel input, .bc-contact__panel textarea {
  width: 100%; border: 1px solid var(--bc-line); border-radius: 8px; padding: 12px 14px;
  font-family: var(--bc-font-body); font-size: 15px; color: var(--bc-ink);
}
.bc-contact__panel input:focus, .bc-contact__panel textarea:focus { outline: 2px solid rgba(232,101,15,.35); border-color: var(--bc-orange); }
@media (max-width: 900px) { .bc-contact { grid-template-columns: 1fr; } }

/* Anchor offset so /solutions/#agendas lands below the sticky header */
.bc-anchor { scroll-margin-top: 92px; }


@media(max-width:991px){
    .bc-cards {
        grid-template-columns: repeat(2, 1fr);
    }
    .bc-hero__inner-pages {
    width: 100% !important;
   }
}
@media(max-width:576px){
    .bc-cards {
        grid-template-columns: repeat(1, 1fr);
    }
    .bc-hero__inner-pages {
    width: 100% !important;
   }
}




/*testimonial-start*/



.bc-testimonials {
    padding: 88px 24px;
    background: var(--bc-bg-soft);
  }

  .bc-testimonials__inner {
    max-width: 1200px;
    margin: 0 auto;
  }

  .bc-testimonials__eyebrow {
    text-align: center;
    color: var(--bc-orange);
    font-family: var(--bc-font-body);
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 1.6px;
    text-transform: uppercase;
    margin: 0 0 12px;
  }

  .bc-testimonials__title {
    text-align: center;
    font-family: var(--bc-font-display);
    font-weight: 700;
    font-size: 38px;
    line-height: 1.2;
    color: var(--bc-ink);
    margin: 0 0 48px;
  }

  .bc-testimonials__title span {
    color: var(--bc-orange);
  }

  /* Viewport that clips the sliding track — exact width for 3 cards + 2 gaps */
  .bc-carousel {
    position: relative;
    overflow: hidden;
  }

  .bc-carousel__track {
    display: flex;
    gap: 24px;
    transition: transform 0.55s cubic-bezier(0.65, 0, 0.35, 1);
  }

  .bc-card {
    flex: 0 0 calc((100% - 48px) / 3);
    background: var(--bc-bg);
    border: 1px solid var(--bc-line);
    border-radius: 16px;
    padding: 30px 26px 30px 26px;
    display: flex;
        align-items: start;
    flex-direction: column;
    box-shadow: 0 1px 3px rgba(58, 63, 70, 0.04);
  }
.bc-card:hover{
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    border: 1px solid var(--bc-orange);
    transition: all 0.8s ease;
}
  .bc-card__quote-mark {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 52px;
    line-height: 45px;
    color: var(--bc-orange);
    font-weight: 700;
  }

  .bc-card__text {
    font-family: var(--bc-font-body);
    font-size: 14.5px;
    line-height: 1.65;
    color: var(--bc-ink);
    margin: 0 0 26px;
    flex-grow: 1;
  }

  .bc-card__person {
    display: flex;
    align-items: center;
    gap: 12px;
    margin:15px 0px;
  }

  .bc-card__avatar {
    width: 66px;
    height: 66px;
    border-radius: 50%;
    background: var(--bc-bg-soft);
    border: 1.5px solid var(--bc-line);
    color: var(--bc-orange-dark);
    font-family: var(--bc-font-display);
    font-weight: 700;
    font-size: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }
 .bc-card__avatar img{
     width: 66px;
  object-fit: cover;
    height: 66px;
    border-radius: 50%;
     
 }
  .bc-card__name {
    font-family: var(--bc-font-display);
    font-weight: 600;
    font-size: 14.5px;
    color: var(--bc-ink);
    margin: 0;
  }

  .bc-card__role {
    font-family: var(--bc-font-body);
    font-size: 12.5px;
    color: var(--bc-ink-soft);
    margin: 3px 0 0;
    line-height: 1.4;
  }

  .bc-card__company {
    font-family: var(--bc-font-display);
    font-weight: 500;
    font-size: 15px;
    color: var(--bc-ink);
    letter-spacing: 0.2px;
    width:100%;
  }

  .bc-card__company span {
    color: var(--bc-orange);
  }

  /* Dots */
  .bc-dots {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-top: 36px;
  }

  .bc-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--bc-line);
    border: none;
    padding: 0;
    cursor: pointer;
    transition: background 0.25s ease, transform 0.25s ease, width 0.25s ease;
  }

  .bc-dot:hover {
    background: var(--bc-orange-dark);
  }

  .bc-dot.is-active {
    background: var(--bc-orange);
    width: 24px;
    border-radius: 5px;
  }
  .bc-testi-bottom{
      display:flex;
      justify-content:space-between;
      align-items:center;
     border-top: 1px solid var(--bc-line);
      padding-top:10px;
      width:100%;
  }
  .bc-testi-bottom-company-logo{
      text-align:right;
  }
   .bc-testi-bottom-company-logo img{
    width: 150px;
  }
  .hck-logo{
      width: 55px;
    height: 35px;
  }
  .bc-testi-bottom-sepa{
      height:20px;
      padding-top:0px !important;
  }
.video-sec {
    padding: 80px 0px 80px 0px;
    width: 80%;
    margin: auto;
}
.video-main-sec{
        border-bottom: 1px solid var(--bc-line);
}
  @media (max-width: 900px) {
    .bc-card { flex: 0 0 calc((100% - 24px) / 2); }
      .bc-testi-bottom-sepa{
      height:auto;
      padding-top:10px !important;
  }
  .video-main-sec{
        border:none;
}
  }
.bc-hero-video{
        display:none;
    }
@media(max-width:991px){
    .bc-hero-image{
        display:none;
    }
    .bc-hero-video{
       display:block;
    }
     .video-sec{
         display:none;
     }

}
  @media (max-width: 620px) {
    .bc-card { flex: 0 0 100%; }
    .bc-testimonials__title { font-size: 28px; }
      .bc-testi-bottom-sepa{
          height:auto;
      }
  }
  
  /*testimonial-end*/


.meta-box{
    display: flex;
    align-items: center;
    gap: 10px;
}
p.bc-meta :hover{
    color:#E8650F;
}
.meta-box a{
        font-size: 15px;
    color: var(--bc-ink-soft);
        font-family: var(--bc-font-body);
    line-height: 1.7;
}
span.bc-meta-separator {
     font-size: 14px;
}