/* Baines Advisory: motion and interaction layer. Loaded on every page after the page's own styles. */

/* Header gains a soft shadow once the page scrolls */
.site-head{transition:box-shadow .3s ease}
.site-head.is-scrolled{box-shadow:0 10px 30px -22px rgba(27,34,51,.55)}

/* Drifting colour in the hero (canvas added by pop.js) */
.hero,.page-hero{position:relative;isolation:isolate}
.hero{overflow:hidden}
.page-hero{overflow:hidden}
.pop-drift{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1}

/* Hero portrait: slow-turning dashed ring and a gentle float */
.hero-visual::after{animation:pop-spin 70s linear infinite}
.hv-frame{animation:pop-float 9s ease-in-out infinite}
@keyframes pop-spin{to{transform:rotate(360deg)}}
@keyframes pop-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* Hero badges lift in, CQC dots light up one by one */
.hv-badge{transition:transform .25s ease,box-shadow .25s ease}
.hv-badge:hover{transform:translateY(-3px);box-shadow:0 18px 38px -20px rgba(27,34,51,.6)}
.hv-badges .hv-badge{animation:pop-rise .7s cubic-bezier(.2,.7,.2,1) backwards}
.hv-badges .hv-badge.b2{animation-delay:.15s}
.hv-badge .dots i{animation:pop-dot .45s cubic-bezier(.3,1.6,.5,1) backwards}
.hv-badge .dots i:nth-child(1){animation-delay:.5s}
.hv-badge .dots i:nth-child(2){animation-delay:.8s}
.hv-badge .dots i:nth-child(3){animation-delay:1.1s}
.hv-badge .dots i:nth-child(4){animation:pop-dot .45s cubic-bezier(.3,1.6,.5,1) 1.4s backwards,pop-glow 2.4s ease-in-out 2s infinite}
@keyframes pop-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes pop-dot{from{transform:scale(.2)}to{transform:scale(1)}}
@keyframes pop-glow{0%,100%{box-shadow:0 0 0 0 rgba(107,39,72,.45)}50%{box-shadow:0 0 0 6px rgba(107,39,72,0)}}

/* Buttons */
.btn{transition:background .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px -12px rgba(107,39,72,.7)}
.btn-ghost:hover{box-shadow:none}

/* Cards and panels respond to the pointer */
.lead,.quote,.ongoing,.svc.lead-svc,.retainer,.fees,.author{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.lead:hover,.svc.lead-svc:hover{transform:translateY(-4px);box-shadow:0 22px 44px -28px rgba(27,34,51,.55)}
.quote:hover{border-color:rgba(255,255,255,.3);transform:translateY(-3px)}
.group .ico,.areas .ico,.svc .ico{transition:background .25s ease,color .25s ease,transform .25s ease}
.group:hover .ico,.areas > div:hover .ico,.svc:hover .ico{background:var(--mul);color:#fff;transform:scale(1.06)}
.group{transition:border-color .25s ease}
.group:hover{border-top-color:var(--mul-deep)}
.list-cols li{transition:color .2s ease,padding-left .2s ease}
.list-cols li:hover{color:var(--mul);padding-left:6px}
.posts a{transition:padding-left .2s ease}
.posts a:hover{padding-left:6px}

/* Board / Organisation / Service: the one you point at comes forward */
.levels .lvl{transition:transform .3s ease,opacity .3s ease,box-shadow .3s ease}
@media (hover:hover){
  .levels:hover .lvl{opacity:.55}
  .levels .lvl:hover{opacity:1;transform:translateX(8px);box-shadow:0 16px 34px -22px rgba(0,0,0,.6)}
}

/* Scroll reveal: pop.js only hides items that start below the fold */
.pop-hide{opacity:0;transform:translateY(26px)}
.pop-in{opacity:1;transform:none;transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}

/* Sticky booking bar on phones */
.pop-bar{display:none}
@media (max-width:700px){
  .pop-bar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:20;padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--line);transform:translateY(110%);transition:transform .35s ease}
  .pop-bar.is-on{transform:none}
  .pop-bar .btn{flex:1;justify-content:center}
  body.has-pop-bar .site-foot{padding-bottom:110px}
}

@media print{.pop-hide{opacity:1!important;transform:none!important}.pop-bar,.pop-drift{display:none!important}}
@media (prefers-reduced-motion:reduce){.pop-hide{opacity:1;transform:none}.pop-drift{display:none}}