/* BrandVerse luxe layer — 08 Oct 2026
   Loaded last on public v3 pages. Principles:
   1. Content is never hidden before JavaScript runs. Reveal motion only applies
      once <html> carries .bv-motion (set by public-experience-v5.js), and the
      hero is excluded from reveals entirely.
   2. Motion is transform/opacity only and fully disabled under reduced motion.
   3. Text meets WCAG AA contrast on the light canvas. */

:root{
  --bvx-ink:#071a3a;
  --bvx-gold:#c9a24e;          /* decorative gold: lines, rules, glows */
  --bvx-gold-text:#7a5818;     /* text gold: 6.5:1 on white */
  --bvx-gold-text-soft:#85601d;/* 5.7:1 on white */
  --bvx-ease:cubic-bezier(.2,.75,.2,1);
}

/* 1. Hero headline: crisp, full contrast, never faded */
body.bv-v3 .bv-v3-hero,
body.bv-v3 .bv-v3-hero-copy,
body.bv-v3 .bv-v3-stage,
body.bv-v3 main>section:first-child{
  opacity:1!important;
}
body.bv-v3 .bv-v3-hero-copy h1{
  color:var(--bvx-ink)!important;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:geometricPrecision;
}
body.bv-v3 .bv-v3-hero-copy h1 em{
  color:var(--bvx-gold-text)!important;
  /* Solid colour first; the gradient is an enhancement that keeps AA contrast
     at every stop (darkest #6c4d12, lightest #8a6420). */
  background:linear-gradient(100deg,#6c4d12 0%,#8a6420 48%,#6c4d12 100%);
  -webkit-background-clip:text;
  background-clip:text;
}
@supports (-webkit-background-clip:text) or (background-clip:text){
  body.bv-v3 .bv-v3-hero-copy h1 em{-webkit-text-fill-color:transparent}
}
@media (forced-colors:active){
  body.bv-v3 .bv-v3-hero-copy h1 em{background:none;-webkit-text-fill-color:currentColor;color:CanvasText!important}
}
body.bv-v3 .bv-v3-hero-copy .lead{color:#3f4f66!important}
body.bv-v3 .bv-v3-word{color:var(--bvx-gold-text)!important}
body.bv-v3 .bv-v3-hero-copy .eyebrow{color:#2c51b8}

/* Gold hairline under the hero headline: drawn once on load (CSS only,
   so the static end state is the default if animations are off). */
body.bv-v3 .bv-v3-hero-copy h1::after{
  content:"";
  display:block;
  width:min(132px,32%);
  height:2px;
  margin-top:clamp(18px,2vw,26px);
  border-radius:2px;
  background:linear-gradient(90deg,var(--bvx-gold),rgba(201,162,78,0));
  transform-origin:left center;
  animation:bvxLineDraw 1.1s var(--bvx-ease) .25s both;
}

/* 2. Header logo: sharper asset, larger optical size, explicit box */
body.bv-v3 .brand-picture,
.nav .brand-picture{display:block;flex:0 0 auto;line-height:0}
body.bv-v3 .nav .brand-lockup{
  display:block;
  width:76px!important;
  height:76px!important;
  max-width:none;
  object-fit:contain;
  clip-path:none!important;
  border-radius:50%!important;
  image-rendering:auto;
}
body.bv-v3 footer .brand-lockup{
  display:block;
  width:76px!important;
  height:76px!important;
  object-fit:contain;
  clip-path:none!important;
}
body.bv-v3 .bv-official-identity img{clip-path:none!important}
body.bv-v3 .bv-verification-logo{
  display:block;
  width:min(180px,48vw)!important;
  height:auto!important;
  object-fit:contain;
}
@media(max-width:760px){
  body.bv-v3 .nav .brand-lockup{width:60px!important;height:60px!important}
}
@media(max-width:360px){
  body.bv-v3 .nav .brand-lockup{width:54px!important;height:54px!important}
}

/* 3. Section reveals: gated on .bv-motion so no-JS visitors see everything */
html:not(.bv-motion) body.bv-v3 .bv-v5-reveal,
html:not(.bv-motion) body.bv-v3 .bv-v3-reveal{
  opacity:1!important;
  transform:none!important;
}
body.bv-v3 .bv-v5-reveal{
  transition:opacity .8s var(--bvx-ease),transform .9s var(--bvx-ease);
  transition-delay:var(--bv-v5-delay,0ms);
}

/* Gold rule beside section eyebrows: scales in when the section is revealed */
body.bv-v3 .bv-section-head .eyebrow,
body.bv-v3 .bv-page-intro .eyebrow{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:12px;
}
body.bv-v3 .bv-section-head .eyebrow::before,
body.bv-v3 .bv-page-intro .eyebrow::before{
  content:"";
  flex:0 0 auto;
  width:28px;
  height:1px;
  background:var(--bvx-gold);
  transform-origin:left center;
}
html.bv-motion body.bv-v3 .bv-section-head.bv-v5-reveal .eyebrow::before{
  transform:scaleX(0);
  transition:transform 1s var(--bvx-ease) .2s;
}
html.bv-motion body.bv-v3 .bv-section-head.bv-v5-reveal.is-visible .eyebrow::before{transform:scaleX(1)}
body.bv-v3 .bv-page-intro .eyebrow::before{animation:bvxLineDraw 1s var(--bvx-ease) .2s both}

/* 4. Refined hover and focus states */
@media(hover:hover) and (pointer:fine){
  body.bv-v3 .nav nav a:not(.nav-cta){position:relative}
  /* Overrides the older left/right underline from brand-refresh.css with a
     transform-only gold hairline. */
  body.bv-v3 .nav nav a:not(.nav-cta)::after{
    content:""!important;
    position:absolute!important;
    left:11px!important;right:11px!important;bottom:7px!important;
    height:1px!important;
    border-radius:1px!important;
    background:var(--bvx-gold)!important;
    transform:scaleX(0);
    transform-origin:left center;
    transition:transform .45s var(--bvx-ease)!important;
  }
  body.bv-v3 .nav nav a:not(.nav-cta):hover::after,
  body.bv-v3 .nav nav a.active:not(.nav-cta)::after{transform:scaleX(1)}

  body.bv-v3 .bv-v5-card{transition:transform .5s var(--bvx-ease),box-shadow .5s var(--bvx-ease),border-color .5s ease}
  body.bv-v3 .bv-v5-card:hover{
    transform:translateY(-3px);
    border-color:rgba(201,162,78,.38);
    box-shadow:0 22px 48px rgba(7,26,58,.10),0 0 0 1px rgba(201,162,78,.14);
  }
  body.bv-v3 .button{transition:transform .35s var(--bvx-ease),box-shadow .35s var(--bvx-ease),background .3s ease,border-color .3s ease,color .3s ease}
  body.bv-v3 .button:hover{transform:translateY(-2px)}
}
body.bv-v3 a:focus-visible,
body.bv-v3 button:focus-visible,
body.bv-v3 [role="tab"]:focus-visible{
  outline:2px solid var(--bvx-gold-text);
  outline-offset:3px;
  border-radius:8px;
}

/* Nav CTA arrow (moved from an injected <style> in main.js for CSP) */
.nav-cta{gap:8px}
.nav-cta .nav-cta-icon{display:inline-flex;align-items:center;justify-content:center;color:#fff!important;opacity:1!important;font-size:15px;font-weight:900;line-height:1;filter:none!important;transform:translateY(-1px);transition:transform .2s ease}
.nav-cta:hover .nav-cta-icon,.nav-cta:focus-visible .nav-cta-icon{color:#fff!important;opacity:1!important;transform:translate(2px,-2px)}
@media(prefers-reduced-motion:reduce){.nav-cta .nav-cta-icon{transition:none!important}}

/* 5. Mobile overflow guard */
@media(max-width:420px){
  body.bv-v3 .bv-v3-hero-copy h1{overflow-wrap:break-word}
  body.bv-v3 .bv-section-head .eyebrow,
  body.bv-v3 .bv-page-intro .eyebrow{flex-wrap:wrap;gap:8px}
}

@keyframes bvxLineDraw{
  from{transform:scaleX(0);opacity:0}
  to{transform:scaleX(1);opacity:1}
}

/* 6. Reduced motion: no movement, final states only */
@media(prefers-reduced-motion:reduce){
  body.bv-v3 .bv-v3-hero-copy h1::after,
  body.bv-v3 .bv-page-intro .eyebrow::before{animation:none!important;transform:none!important;opacity:1!important}
  html.bv-motion body.bv-v3 .bv-section-head.bv-v5-reveal .eyebrow::before{transform:none!important;transition:none!important}
  body.bv-v3 .bv-v5-reveal,
  body.bv-v3 .bv-v3-reveal{opacity:1!important;transform:none!important;transition:none!important}
  body.bv-v3 .nav nav a:not(.nav-cta)::after,
  body.bv-v3 .bv-v5-card,
  body.bv-v3 .button{transition:none!important}
  body.bv-v3 .bv-v5-card:hover,
  body.bv-v3 .button:hover{transform:none!important}
}

/* Print: everything visible, no decoration */
@media print{
  body.bv-v3 .bv-v5-reveal,
  body.bv-v3 .bv-v3-reveal{opacity:1!important;transform:none!important}
}

/* Ecosystem showcase: live screenshots and integration chips (8 Oct 2026) */
.bv-product-story-visual picture,.bv-work-visual picture{display:block;width:100%;height:100%}
.bv-product-story-visual picture img,.bv-work-visual picture img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}
.bv-integrations{margin:14px 0 18px}
.bv-integrations b{display:block;margin:0 0 8px;color:var(--color-brand-primary,#0b1f3a);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.bv-integrations ul{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.bv-integrations li{padding:5px 10px;border:1px solid rgba(122,88,24,.28);border-radius:999px;background:rgba(201,162,74,.08);color:#2b2b2b;font-size:12px;font-weight:600;line-height:1.3}
@media (hover:hover) and (prefers-reduced-motion:no-preference){
 .bv-product-story-visual picture img,.bv-work-visual picture img{transition:transform 600ms cubic-bezier(.2,.7,.2,1)}
 .bv-product-story article:hover .bv-product-story-visual picture img,.bv-work-entry:hover .bv-work-visual picture img{transform:scale(1.02)}
}
body.bv-v2 .bv-product-story-visual.bv-product-shot{min-height:0;align-self:center;background:#0b1220}
body.bv-v2 .bv-product-story-visual.bv-product-shot img,.bv-work-visual picture img{min-height:0!important;height:auto!important;aspect-ratio:16/10;object-fit:cover;object-position:top left}