/* ============================================================
   Briafix — PwC-inspired editorial sections
   Loaded by index.html, insights.html, industries.html
   ============================================================ */

/* ---------- Editorial insight block ---------- */
.bf-feature-insight { background: var(--briafix-navy); color: #fff; padding: 96px 0; position: relative; overflow: hidden; }
.bf-feature-insight::before {
  content: ''; position: absolute; right: -200px; top: -200px;
  width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(230,83,0,0.14), transparent 60%);
  pointer-events: none;
}
.bf-feature-insight__grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: 64px; align-items: center; position: relative; z-index: 1; }
@media (max-width: 1024px) { .bf-feature-insight__grid { grid-template-columns: 1fr; gap: 32px; } }
.bf-feature-insight .tag { display: inline-flex; align-items: center; gap: 8px; font: 600 11.5px/1 var(--font-mono); color: var(--briafix-orange); text-transform: uppercase; letter-spacing: 0.18em; }
.bf-feature-insight .tag::before { content: ''; width: 28px; height: 1.5px; background: currentColor; }
.bf-feature-insight h2 { font-family: var(--font-display); font-weight: 700; font-size: clamp(34px, 4.5vw, 52px); line-height: 1.05; letter-spacing: -0.03em; color: #fff; margin: 18px 0 22px; }
.bf-feature-insight h2 .accent { color: var(--briafix-orange); }
.bf-feature-insight .lead { font-size: 18px; line-height: 1.6; color: rgba(255,255,255,0.78); margin: 0 0 28px; max-width: 50ch; }
.bf-feature-insight .meta { display: flex; gap: 18px; flex-wrap: wrap; margin-bottom: 28px; }
.bf-feature-insight .meta .item { display: flex; gap: 8px; align-items: center; font-size: 13.5px; color: rgba(255,255,255,0.65); font-family: var(--font-mono); }
.bf-feature-insight .meta .item .lucide { width: 14px; height: 14px; color: var(--briafix-orange); }

.bf-feature-insight__art { position: relative; aspect-ratio: 4 / 5; border-radius: var(--radius-xl); overflow: hidden; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); }
.bf-feature-insight__art image-slot { width: 100%; height: 100%; display: block; }
.bf-feature-insight__art .badge {
  position: absolute; top: 24px; left: 24px; background: var(--briafix-orange-deep); color: #fff;
  padding: 8px 14px; border-radius: 999px; font: 600 11px/1 var(--font-mono); letter-spacing: 0.14em; text-transform: uppercase;
}
.bf-feature-insight__art .stat-card {
  position: absolute; bottom: 24px; left: 24px; right: 24px;
  background: rgba(11,29,51,0.92); backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: var(--radius-md); padding: 20px 22px;
  display: grid; grid-template-columns: auto 1fr; gap: 18px; align-items: center;
}
.bf-feature-insight__art .stat-card .v { font-family: var(--font-display); font-weight: 700; font-size: 48px; line-height: 0.95; letter-spacing: -0.03em; color: #fff; }
.bf-feature-insight__art .stat-card .v .accent { color: var(--briafix-orange); }
.bf-feature-insight__art .stat-card .l { font-size: 13px; color: rgba(255,255,255,0.72); line-height: 1.45; }

/* ---------- CEO Survey style stat band ---------- */
.bf-survey { padding: 80px 0; background: #fff; border-top: 1px solid var(--border-subtle); border-bottom: 1px solid var(--border-subtle); }
.bf-survey__grid { display: grid; grid-template-columns: 1fr 1.4fr; gap: 56px; align-items: center; }
@media (max-width: 980px) { .bf-survey__grid { grid-template-columns: 1fr; gap: 32px; } }
.bf-survey .left .bf-eyebrow { margin-bottom: 12px; }
.bf-survey .left h2 { font-family: var(--font-display); font-weight: 700; font-size: clamp(28px, 3.6vw, 40px); line-height: 1.1; letter-spacing: -0.025em; color: var(--fg-1); margin: 0 0 16px; }
.bf-survey .left p { font-size: 16px; line-height: 1.6; color: var(--fg-3); margin: 0 0 24px; max-width: 42ch; }
.bf-survey .left .source { font: 500 12px/1.5 var(--font-mono); color: var(--fg-3); }

.bf-survey__pivot {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0;
  border-left: 1px solid var(--border-subtle);
  border-top: 1px solid var(--border-subtle);
}
.bf-survey__pivot .cell {
  padding: 28px 28px;
  border-right: 1px solid var(--border-subtle);
  border-bottom: 1px solid var(--border-subtle);
}
.bf-survey__pivot .cell.is-hero { background: var(--briafix-navy); color: #fff; }
.bf-survey__pivot .cell.is-hero .v { color: #fff; }
.bf-survey__pivot .cell.is-hero .v .accent { color: var(--briafix-orange); }
.bf-survey__pivot .cell.is-hero .l { color: rgba(255,255,255,0.72); }
.bf-survey__pivot .v { font-family: var(--font-display); font-weight: 700; font-size: clamp(40px, 5vw, 60px); line-height: 0.95; letter-spacing: -0.035em; color: var(--fg-1); }
.bf-survey__pivot .v .accent { color: var(--briafix-orange-deep); }
.bf-survey__pivot .v .small { font-size: 0.4em; vertical-align: top; opacity: 0.7; margin-left: 2px; }
.bf-survey__pivot .l { font-size: 13.5px; color: var(--fg-3); line-height: 1.5; margin-top: 12px; max-width: 30ch; }

/* ---------- Insights index (list page) ---------- */
.bf-insight-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
@media (max-width: 980px) { .bf-insight-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .bf-insight-grid { grid-template-columns: 1fr; } }

.bf-insight-card {
  background: #fff; border: 1px solid var(--border-subtle); border-radius: var(--radius-lg);
  overflow: hidden; display: flex; flex-direction: column;
  transition: box-shadow var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out);
  text-decoration: none; color: inherit;
}
.bf-insight-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-3px); }
.bf-insight-card__img { aspect-ratio: 16 / 10; background: var(--neutral-100); border-bottom: 1px solid var(--border-subtle); position: relative; overflow: hidden; }
.bf-insight-card__img image-slot { width: 100%; height: 100%; display: block; }
.bf-insight-card__img .cat {
  position: absolute; top: 16px; left: 16px; background: var(--briafix-navy); color: #fff;
  padding: 5px 11px; border-radius: 999px; font: 600 10.5px/1 var(--font-mono); letter-spacing: 0.14em; text-transform: uppercase;
}
.bf-insight-card__body { padding: 22px 24px 24px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.bf-insight-card__body .ttl { font-family: var(--font-display); font-weight: 700; font-size: 19px; line-height: 1.25; letter-spacing: -0.015em; color: var(--fg-1); }
.bf-insight-card__body .ex { font-size: 14px; line-height: 1.55; color: var(--fg-3); margin: 0; }
.bf-insight-card__body .meta { margin-top: auto; padding-top: 14px; border-top: 1px solid var(--border-subtle); display: flex; gap: 12px; align-items: center; font-size: 12px; color: var(--fg-3); font-family: var(--font-mono); }
.bf-insight-card__body .meta .read { color: var(--briafix-orange-deep); font-weight: 600; }

.bf-insight-card.is-feature { grid-column: span 2; grid-row: span 2; flex-direction: row; }
@media (max-width: 980px) { .bf-insight-card.is-feature { grid-column: auto; grid-row: auto; flex-direction: column; } }
.bf-insight-card.is-feature .bf-insight-card__img { aspect-ratio: auto; height: auto; min-height: 360px; border-bottom: 0; border-right: 1px solid var(--border-subtle); flex: 1.2; }
@media (max-width: 980px) { .bf-insight-card.is-feature .bf-insight-card__img { border-right: 0; border-bottom: 1px solid var(--border-subtle); min-height: 220px; } }
.bf-insight-card.is-feature .bf-insight-card__body { flex: 1; padding: 36px 36px 32px; }
.bf-insight-card.is-feature .ttl { font-size: 30px; line-height: 1.15; }
.bf-insight-card.is-feature .ex { font-size: 16px; line-height: 1.6; }

/* Filter chips */
.bf-filter-row { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 32px; }
.bf-filter-chip {
  padding: 8px 14px; border-radius: 999px; background: #fff; border: 1px solid var(--border-default);
  font: 600 12.5px/1 var(--font-body); color: var(--fg-2); cursor: pointer;
  transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.bf-filter-chip:hover { border-color: var(--briafix-navy); color: var(--fg-1); }
.bf-filter-chip.is-active { background: var(--briafix-navy); color: #fff; border-color: var(--briafix-navy); }

/* ---------- Industries page ---------- */
.bf-ind-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
@media (max-width: 980px) { .bf-ind-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .bf-ind-grid { grid-template-columns: 1fr; } }

.bf-ind-card {
  background: #fff; border: 1px solid var(--border-subtle); border-radius: var(--radius-lg);
  overflow: hidden; display: flex; flex-direction: column;
  text-decoration: none; color: inherit;
  transition: box-shadow var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out);
}
.bf-ind-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-3px); }
.bf-ind-card__top { background: var(--briafix-navy); color: #fff; padding: 28px 28px 22px; display: flex; flex-direction: column; gap: 12px; position: relative; overflow: hidden; }
.bf-ind-card__top::before {
  content: ''; position: absolute; right: -40px; bottom: -40px;
  width: 140px; height: 140px;
  background: linear-gradient(135deg, var(--briafix-orange-deep), var(--briafix-orange));
  opacity: 0.18; border-radius: 30px; transform: rotate(15deg);
}
.bf-ind-card__top .ic { width: 44px; height: 44px; border-radius: 10px; background: rgba(255,255,255,0.10); color: var(--briafix-orange); display: flex; align-items: center; justify-content: center; position: relative; z-index: 1; }
.bf-ind-card__top .ic .lucide { width: 22px; height: 22px; }
.bf-ind-card__top h3 { font-family: var(--font-display); font-weight: 700; font-size: 20px; color: #fff; letter-spacing: -0.015em; margin: 0; line-height: 1.2; position: relative; z-index: 1; }
.bf-ind-card__body { padding: 22px 28px 26px; flex: 1; display: flex; flex-direction: column; gap: 12px; }
.bf-ind-card__body p { font-size: 14px; line-height: 1.55; color: var(--fg-2); margin: 0; }
.bf-ind-card__body ul { padding: 0; margin: 4px 0 0; list-style: none; display: flex; flex-direction: column; gap: 7px; }
.bf-ind-card__body ul li { font-size: 12.5px; color: var(--fg-3); display: flex; gap: 7px; align-items: center; }
.bf-ind-card__body ul li::before { content: ''; width: 4px; height: 4px; border-radius: 50%; background: var(--briafix-orange-deep); flex-shrink: 0; }
.bf-ind-card__body .stat { margin-top: auto; padding-top: 16px; border-top: 1px solid var(--border-subtle); display: flex; gap: 14px; align-items: baseline; }
.bf-ind-card__body .stat .v { font: 700 22px/1 var(--font-display); color: var(--fg-1); letter-spacing: -0.02em; }
.bf-ind-card__body .stat .v .accent { color: var(--briafix-orange-deep); }
.bf-ind-card__body .stat .l { font-size: 11.5px; color: var(--fg-3); font-family: var(--font-mono); }

/* ---------- Mega-menu ---------- */
.bf-header { position: relative; }
.bf-mega {
  position: absolute; left: 0; right: 0; top: 100%;
  background: #fff; border-bottom: 1px solid var(--border-subtle);
  box-shadow: 0 24px 48px -16px rgba(11,29,51,0.12);
  opacity: 0; pointer-events: none;
  transform: translateY(-8px);
  transition: opacity 180ms var(--ease-out), transform 180ms var(--ease-out);
  z-index: 49;
}
.bf-mega.is-open { opacity: 1; pointer-events: auto; transform: none; }
.bf-mega__inner {
  padding: 36px 0 40px;
  display: grid; grid-template-columns: 1fr 1fr 1fr 1.1fr;
  gap: 40px;
}
@media (max-width: 1100px) { .bf-mega__inner { grid-template-columns: 1fr 1fr; } }
.bf-mega .col h6 {
  font: 700 11px/1 var(--font-mono); text-transform: uppercase; letter-spacing: 0.16em;
  color: var(--orange-600); margin: 0 0 16px;
}
.bf-mega .col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.bf-mega .col a {
  display: flex; gap: 10px; align-items: center;
  font-size: 14px; color: var(--fg-1); text-decoration: none;
  padding: 6px 8px; margin: -6px -8px;
  border-radius: 6px;
  transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.bf-mega .col a:hover { background: var(--neutral-100); color: var(--briafix-orange-deep); }
.bf-mega .col a .lucide { width: 16px; height: 16px; color: var(--fg-3); flex-shrink: 0; }
.bf-mega .col a:hover .lucide { color: var(--briafix-orange-deep); }

.bf-mega .col.spot { background: var(--briafix-navy); color: #fff; border-radius: var(--radius-lg); padding: 24px; margin: -8px; }
.bf-mega .col.spot h6 { color: var(--briafix-orange); }
.bf-mega .col.spot .lbl { font: 700 18px/1.2 var(--font-display); color: #fff; letter-spacing: -0.015em; margin-bottom: 8px; }
.bf-mega .col.spot .desc { font-size: 13px; line-height: 1.5; color: rgba(255,255,255,0.7); margin-bottom: 14px; }
.bf-mega .col.spot .lnk { color: var(--briafix-orange); font: 600 13px/1 var(--font-body); display: inline-flex; gap: 4px; align-items: center; text-decoration: none; }
.bf-mega .col.spot .lnk:hover { color: var(--briafix-amber); }

/* Make nav links a hover target for the mega-menu */
.bf-nav a.has-mega { cursor: default; }
@media (max-width: 980px) { .bf-mega { display: none !important; } }

/* ---------- Mobile nav ---------- */
.bf-burger {
  display: none; width: 44px; height: 44px; border: 1px solid var(--border-default);
  background: #fff; border-radius: var(--radius-sm); cursor: pointer;
  align-items: center; justify-content: center; color: var(--fg-1); flex-shrink: 0;
}
.bf-burger .lucide { width: 22px; height: 22px; }
.bf-mobile { display: none; }
@media (max-width: 980px) {
  .bf-burger { display: inline-flex; }
  .bf-header__rt .bf-availability { display: none; }
  .bf-header__rt .bf-btn { display: none; }
  .bf-mobile {
    display: block; position: fixed; inset: 0; top: 0; z-index: 60;
    background: rgba(11,29,51,0.6); backdrop-filter: blur(4px);
    opacity: 0; pointer-events: none; transition: opacity 200ms var(--ease-out);
  }
  .bf-mobile.is-open { opacity: 1; pointer-events: auto; }
  .bf-mobile__panel {
    position: absolute; top: 0; right: 0; height: 100%; width: min(86vw, 360px);
    background: var(--briafix-navy); color: #fff; padding: 20px;
    display: flex; flex-direction: column; gap: 4px;
    transform: translateX(100%); transition: transform 260ms var(--ease-out);
    overflow-y: auto;
  }
  .bf-mobile.is-open .bf-mobile__panel { transform: none; }
  .bf-mobile__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
  .bf-mobile__head img { height: 26px; filter: brightness(0) invert(1); }
  .bf-mobile__close { width: 40px; height: 40px; border: 0; background: rgba(255,255,255,0.08); border-radius: 8px; color: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center; }
  .bf-mobile a {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 12px; border-radius: var(--radius-sm); text-decoration: none;
    color: rgba(255,255,255,0.85); font: 600 16px/1 var(--font-display);
    border-bottom: 1px solid rgba(255,255,255,0.06);
  }
  .bf-mobile a:hover, .bf-mobile a.is-active { background: rgba(255,255,255,0.06); color: #fff; }
  .bf-mobile a.is-active { color: var(--briafix-orange); }
  .bf-mobile .bf-btn { margin-top: 16px; justify-content: center; }
  .bf-mobile__contact { margin-top: auto; padding-top: 16px; font-size: 13px; color: rgba(255,255,255,0.6); line-height: 1.7; }
  .bf-mobile__contact a { display: inline; padding: 0; border: 0; font: inherit; color: var(--briafix-orange); }
}
