/* veefivee v28: canonical responsive navigation behavior.                                  
 * Include as the final CSS file on EVERY marketing page (including industries/ pages). 
 * Desktop design remains unchanged. Mobile keeps exactly the original six links; no More dropdown. */

@media (max-width: 767.98px) {
  [data-nav-pill] > .vf-nav-blog { display: none !important; }

  /* Regular Contact is a simple blue text link, same weight as its neighbors. */
  [data-nav-pill] > a[aria-label="Contact veefivee"] {
    background: transparent !important;
    box-shadow: none !important;
    --tw-ring-shadow: 0 0 #0000 !important;
    color: #2c5ff4 !important;
    font-weight: 500 !important;
    transform: none !important;
    text-shadow: none !important;
  }
  /* Selected Contact is dark and bold, matching selected Home / About / Services.
     No colored button or selection bubble; use both status conventions safely. */
  [data-nav-pill] > a[aria-label="Contact veefivee"][aria-current="page"],
  [data-nav-pill] > a[aria-label="Contact veefivee"][data-status="active"] {
    color: #26243d !important;
    font-weight: 800 !important;
    background: transparent !important;
    box-shadow: none !important;
    --tw-ring-shadow: 0 0 #0000 !important;
  }
  [data-nav-pill] > a[aria-label="Contact veefivee"] .vf-nav-contact-desktop { display: none !important; }
  [data-nav-pill] > a[aria-label="Contact veefivee"] .vf-nav-contact-mobile { display: inline !important; }
}
@media (min-width: 768px) {
  [data-nav-pill] > a[aria-label="Contact veefivee"] .vf-nav-contact-desktop { display: inline !important; }
  [data-nav-pill] > a[aria-label="Contact veefivee"] .vf-nav-contact-mobile { display: none !important; }
}
@media (min-width: 768px) and (max-width: 900px) {
  [data-nav-pill] > .vf-nav-blog,
  [data-nav-pill] > .vf-nav-products { padding-inline: 7px !important; }
  [data-nav-pill] > a { font-size: .72rem !important; }
}

/* v32: stabilize the glass header without removing its appearance or motion. */
@media(min-width:768px){html{scrollbar-gutter:stable}}
@media(min-width:901px){[data-nav-pill]{width:min(760px,calc(100vw - 32px));justify-content:space-evenly}}
@media(min-width:768px) and (max-width:900px){[data-nav-pill]{width:min(640px,calc(100vw - 32px));justify-content:space-evenly}}
@media(max-width:767.98px){[data-nav-pill]{width:100%}}
[data-nav-pill]{transition-property:background-color,box-shadow,border-color!important;transition-duration:.28s!important}

/* v33 consultation — canonical CTA in the existing desktop/mobile header.
   Keep exactly six mobile links and the original two-row glass capsule. */
@media(min-width:901px){
  [data-nav-pill]{width:min(860px,calc(100vw - 32px));justify-content:space-evenly}
  [data-nav-pill] > .vf-nav-consultation{padding-inline:12px!important}
}
@media(min-width:768px) and (max-width:900px){
  [data-nav-pill]{width:min(760px,calc(100vw - 24px))}
  [data-nav-pill] > .vf-nav-consultation{font-size:.70rem!important;padding-inline:7px!important}
}
@media(max-width:767.98px){
  [data-nav-pill] > .vf-nav-consultation{
    background:transparent!important;
    box-shadow:none!important;
    --tw-ring-shadow:0 0 #0000!important;
    color:#2c5ff4!important;
    font-weight:500!important;
    transform:none!important;
    text-shadow:none!important;
  }
  [data-nav-pill] > .vf-nav-consultation[aria-current="page"],
  [data-nav-pill] > .vf-nav-consultation[data-status="active"]{
    background:transparent!important;
    box-shadow:none!important;
    --tw-ring-shadow:0 0 #0000!important;
    color:#26243d!important;
    font-weight:800!important;
  }
}
@media(max-width:520px){
  [data-nav-pill]>a:not(.vf-mobile-brand):not(.hidden){font-size:clamp(.56rem,2.35vw,.67rem)!important;padding-left:3px!important;padding-right:3px!important}
  [data-nav-pill]>.vf-nav-consultation{font-size:clamp(.56rem,2.35vw,.67rem)!important;letter-spacing:-.015em!important}
}
@media(max-width:360px){
  [data-nav-pill]>a:not(.vf-mobile-brand):not(.hidden){font-size:.565rem!important;padding-left:2px!important;padding-right:2px!important}
  [data-nav-pill]>.vf-nav-consultation{font-size:.565rem!important}
}

/* Keep touch-friendly hit targets without forcing full-page navigation. */
@media(hover:none) and (pointer:coarse){[data-nav-pill] a{touch-action:manipulation;pointer-events:auto;-webkit-tap-highlight-color:transparent}[data-nav-pill] a:hover{transform:none!important}}

/* Shared header typography across marketing, articles and tool pages. */
nav:has([data-nav-pill]),[data-nav-pill],[data-nav-pill] a{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important}

/* A restrained 1px wordmark increase; reserve a little extra capsule height. */
[data-nav-pill] > a[aria-label="veefivee home"]{font-size:15px!important}
[data-nav-pill] > .vf-mobile-brand{padding-top:4px!important;padding-bottom:3px!important}
@media(min-width:768px) and (max-width:900px){[data-nav-pill] > a[aria-label="veefivee home"]{font-size:13px!important}}
/* Hero entrance: preserve fade, lift and stagger without animating a blur
   over nested glass surfaces. Avoid scaling text during its entrance. */
.vf-home-page > .home-hero > .mx-auto.max-w-4xl{animation:none!important;will-change:auto}
.vf-home-page .home-hero .rise-in{animation-name:vf-hero-lift;will-change:auto}
@keyframes vf-hero-lift{from{opacity:0;transform:translate3d(0,20px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@media(prefers-reduced-motion:reduce){.vf-home-page .home-hero .rise-in{animation:none!important;opacity:1;transform:none}}
