/* BVC is an editorial scene in SIXIS, separate from its four commercial axes. */
.hero-budget-entry { position: absolute; top: 100%; left: 0; display: inline-flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 7px; min-height: 54px; margin-top: 24px; color: var(--paper); text-decoration: none; pointer-events: auto; }
.hero-budget-entry > span { display: inline-flex; align-items: center; gap: 20px; font: 11px/1.4 var(--mono); letter-spacing: .025em; }
.hero-budget-entry i { color: var(--teal); font: normal 18px/1 var(--sans); transition: transform .2s; }
.hero-budget-entry small { color: #b2c4bf; font: 9px/1.5 var(--mono); letter-spacing: .035em; }
.hero-budget-entry:hover i { transform: translateX(5px); }
.hero-budget-entry:focus-visible, .bvc a:focus-visible, .bvc button:focus-visible, .bvc summary:focus-visible, .footer-budget-entry:focus-visible { outline: 2px solid var(--teal); outline-offset: 5px; }
/* Let native history restore its offset without a second anchor correction while
   the preceding OUTSOURCING scene acquires its enhanced height on initial load. */
html:not([data-bvc-history-ready]):has(#bvc:target) { overflow-anchor: none; }
.bvc { position: relative; isolation: isolate; padding: clamp(92px, 9vw, 150px) clamp(24px, 7.5vw, 140px) clamp(100px, 9vw, 150px); background: #050b0d; scroll-margin-top: var(--home-header-height, 0px); }
.bvc:focus { outline: none; }
.bvc-photo { position: absolute; z-index: -2; inset: 0; overflow: hidden; pointer-events: none; }
.bvc-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 50%; opacity: .8; }
.bvc-photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #050b0d 0%, rgba(5,11,13,.94) 22%, rgba(5,11,13,.64) 51%, rgba(5,11,13,.14) 100%), linear-gradient(0deg, #05090a, transparent 18%, transparent 80%, #05090a); }
.bvc-layout { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); gap: clamp(36px, 5vw, 80px); align-items: center; max-width: 1440px; margin: auto; }
.bvc-identity { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 16px; margin-bottom: 28px; }
.bvc-identity > span { color: var(--teal); font: 12px/1.4 var(--mono); letter-spacing: .04em; }
.bvc-identity small { color: #b2c4bf; font: 10px/1.6 var(--mono); }
.bvc h2 { margin: 0; font: 300 clamp(46px, 4.65vw, 76px)/1.06 var(--sans); letter-spacing: -.055em; }
.bvc h2 > span, .bvc h2 > em { display: block; }
.bvc h2 > em { color: var(--teal); font-family: Georgia, 'Times New Roman', serif; font-weight: 400; letter-spacing: -.065em; }
.bvc-subtitle { margin: 24px 0 34px; color: #e2eae5; font: 300 clamp(19px, 1.6vw, 24px)/1.5 var(--sans); letter-spacing: -.02em; }
.bvc-editorial { max-width: 49ch; color: #bdc9c4; font: 16px/1.75 var(--sans); }
.bvc-editorial p { margin: 0 0 17px; }
.bvc-editorial strong { color: var(--paper); font-weight: 500; }
.bvc-editorial .bvc-for-everyone { margin-top: 25px; }
.bvc-cta { display: inline-flex; align-items: center; min-height: 48px; margin-top: 10px; border-bottom: 1px solid rgba(92,244,220,.6); color: var(--teal); font: 13px/1.5 var(--mono); text-decoration: none; transition: border-color .2s, color .2s; }
.bvc-cta:hover { color: #fff; border-color: #fff; }
.bvc-guide-link { display: flex; align-items: center; width: fit-content; min-height: 44px; margin-top: 6px; color: #b2c4bf; font: 11px/1.5 var(--mono); text-decoration: none; transition: color .2s; }
.bvc-guide-link:hover { color: var(--teal); }
/* A native financial view, open to the photographic scene rather than boxed in a SaaS card. */
.bvc-projection { min-width: 0; margin: 24px 0 0; padding: 28px 0; border-block: 1px solid rgba(191,224,214,.25); background: linear-gradient(90deg, rgba(5,14,16,.48), rgba(5,14,16,.08)); transform: perspective(1200px) rotateY(-4deg); }
.bvc-projection-head { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.bvc-projection-head > span { color: #e3eee8; font: 15px/1.4 var(--sans); letter-spacing: -.025em; }
.bvc-projection-head small { color: #b2c4bf; font: 9px/1.5 var(--mono); letter-spacing: .03em; }
.bvc-scenarios { display: flex; flex-wrap: wrap; gap: 16px; margin: 24px 0 0; }
.bvc-scenarios[hidden] { display: none; }
.bvc-scenarios button { min-height: 44px; padding: 0 2px; border: 0; border-bottom: 1px solid transparent; border-radius: 0; background: none; color: #c6d2cc; font: 11px/1.5 var(--mono); cursor: pointer; }
.bvc-scenarios button[aria-pressed="true"] { color: var(--teal); border-color: var(--teal); }
.bvc-scenarios button:hover { color: #fff; }
.bvc-scenario-note { min-height: 3.2em; margin: 16px 0 4px; color: #bdc9c4; font: 11px/1.6 var(--mono); }
.bvc-chart { display: block; width: 100%; height: auto; overflow: visible; }
.bvc-chart text { fill: #b6c5be; font: 10px var(--mono); }
.bvc-chart .bvc-grid { stroke: rgba(191,224,214,.16); stroke-width: 1; stroke-dasharray: 2 7; }
.bvc-chart .bvc-zero { stroke: rgba(191,224,214,.4); stroke-width: 1; }
.bvc-line { fill: none; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.bvc-income { color: #5cf4dc; stroke: currentColor; }
.bvc-costs { color: #d5ae7c; stroke: currentColor; stroke-dasharray: .015 .015; }
.bvc-profit { color: #c8b6f2; stroke: currentColor; }
.bvc-chart .bvc-dot { fill: #c8b6f2; stroke: #182326; stroke-width: 3; }
.bvc-legend { display: flex; flex-wrap: wrap; gap: 12px 20px; margin: 8px 0 24px; padding: 0; list-style: none; color: #d0dcd5; font: 10px/1.6 var(--mono); }
.bvc-legend li { display: flex; align-items: center; gap: 8px; }
.bvc-legend i { display: block; width: 19px; height: 2px; background: currentColor; }
.bvc-legend .bvc-costs { background: repeating-linear-gradient(90deg, currentColor 0 5px, transparent 5px 8px); }
.bvc-example-totals { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin: 0 0 20px; }
.bvc-example-totals > div { min-width: 0; }
.bvc-example-totals dt { color: #b2c4bf; font: 10px/1.6 var(--mono); }
.bvc-example-totals dd { margin: 7px 0 0; color: var(--paper); font: 300 clamp(23px, 2.5vw, 38px)/1.2 var(--sans); letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.bvc-example-totals > div:last-child dd { color: #c8b6f2; }
.bvc figcaption { color: #b2c4bf; font: 10px/1.65 var(--mono); }
.bvc-values { margin-top: 8px; color: #bdc9c4; font: 10px/1.5 var(--mono); }
.bvc-values summary { display: flex; align-items: center; min-height: 44px; width: fit-content; cursor: pointer; text-decoration: underline; text-underline-offset: 4px; }
.bvc-values summary::after { content: '+'; margin-left: 12px; color: var(--teal); font-size: 15px; }
.bvc-values[open] summary::after { content: '−'; }
.bvc-values table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.bvc-values :is(th, td) { padding: 9px 4px; border-bottom: 1px solid rgba(191,224,214,.18); text-align: right; font-weight: 400; }
.bvc-values :is(th, td):first-child { text-align: left; }
.bvc-values caption { padding-block: 8px 15px; text-align: left; }
.bvc-values th { color: #e3eee8; }
.bvc[data-bvc-ready]:not(.is-visible) .bvc-line { stroke-dasharray: 1; stroke-dashoffset: 1; }
.bvc[data-bvc-ready].is-visible .bvc-line { animation: bvc-line-reveal 1.2s cubic-bezier(.2,.65,.25,1) both; }
@keyframes bvc-line-reveal { from { stroke-dasharray: 1; stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
.footer-budget-entry { display: inline-flex; flex-direction: column; justify-content: center; gap: 5px; min-height: 44px; margin-top: 17px; color: #d1e1d9; font: 11px/1.6 var(--mono); text-decoration: none; }
.footer-budget-entry small { color: #aabdb3; font-size: 9px; }
.footer-budget-entry:hover { color: var(--teal); }
@media (max-width:1100px) {
  .bvc { padding-inline: clamp(24px, 5vw, 64px); }
  .bvc-layout { gap: 32px; }
  .bvc h2 { font-size: clamp(42px, 5vw, 58px); }
  .bvc-projection { transform: none; }
}
@media (max-width:800px) {
  .bvc-layout { grid-template-columns: minmax(0, 1fr); gap: 52px; max-width: 620px; }
  .bvc { padding-top: 90px; padding-bottom: 110px; }
  .bvc-photo img { object-position: 75% 100%; }
  .bvc-photo::after { background: linear-gradient(180deg, #050b0d 0%, rgba(5,11,13,.94) 20%, rgba(5,11,13,.75) 48%, rgba(5,11,13,.35) 78%, #05090a 100%); }
  .bvc h2 { font-size: clamp(40px, 6.9vw, 60px); }
  .bvc-projection { margin: 0; }
  .bvc-editorial { max-width: 52ch; }
}
@media (max-width:600px) {
  .hero-budget-entry { margin-top: 20px; gap: 6px; max-width: 100%; }
  .hero-budget-entry > span { font-size: 10px; gap: 16px; }
  .hero-budget-entry small { max-width: 100%; font-size: 8px; letter-spacing: 0; line-height: 1.6; }
  .bvc { padding-inline: 24px; }
  .bvc-identity { gap: 6px; flex-direction: column; margin-bottom: 25px; }
  .bvc-identity small { font-size: 9px; }
  .bvc h2 { font-size: clamp(38px, 9.2vw, 53px); }
  .bvc-subtitle { margin: 22px 0 28px; font-size: 20px; }
  .bvc-editorial { font-size: 16px; line-height: 1.75; }
  .bvc-cta { font-size: 12px; }
  .bvc-projection-head > span { font-size: 16px; }
  .bvc-projection-head small { font-size: 9px; }
  .bvc-scenarios { margin-top: 16px; }
  .bvc-legend { font-size: 9px; gap: 10px 14px; }
  .bvc-example-totals { gap: 14px; }
  .bvc-example-totals dd { font-size: 26px; }
  .bvc-values :is(th, td) { padding-inline: 2px; font-size: 9px; }
}
@media (max-width:360px) {
  .bvc { padding-inline: 20px; }
  .bvc h2 { font-size: 35px; }
  .bvc-example-totals { grid-template-columns: 1fr; }
}
@media (max-height:500px) {
  .hero-budget-entry { margin-top: 12px; min-height: 44px; gap: 2px; }
  .hero-budget-entry > span { font-size: 9px; }
  .hero-budget-entry small { font-size: 7px; }
  .bvc { padding-top: 60px; }
}
@media (max-width:1100px) and (max-height:360px) and (orientation:landscape) {
  /* Keep the 44 px link beside the lower scene control on very short phones. */
  .hero-budget-entry { left: auto; right: 0; }
}
@media (prefers-reduced-motion:reduce) {
  .hero-budget-entry i, .bvc-cta, .bvc-guide-link { transition: none; }
  .bvc[data-bvc-ready] .bvc-line { animation: none; stroke-dashoffset: 0; }
  .bvc[data-bvc-ready] .bvc-costs { stroke-dasharray: .015 .015; }
}
@media (forced-colors:active) {
  .bvc, .bvc-projection { background: Canvas; color: CanvasText; }
  .bvc-photo { display: none; }
  .bvc :is(p, span, small, strong, em, dt, dd, figcaption, th), .hero-budget-entry small { color: CanvasText; }
  .bvc :is(a, button), .hero-budget-entry, .footer-budget-entry { color: LinkText; }
  .bvc button[aria-pressed="true"] { border-color: Highlight; }
  .bvc-chart text { fill: CanvasText; }
  .bvc-line { stroke: CanvasText; }
  .bvc-profit { stroke-dasharray: 2 4; }
  .bvc-chart .bvc-grid, .bvc-chart .bvc-zero { stroke: GrayText; }
}
