/* fx.css - shared premium effects layer (split headings, gold dust, ripple, parallax).
   Everything here is progressive: without fx.js the site renders exactly as before. */

/* split headings: each word slides up from behind a mask */
.fx-split .fx-w{display:inline-block;overflow:hidden;vertical-align:bottom;padding-block:.08em;margin-block:-.08em;}
.fx-split .fx-wi{display:inline-block;will-change:transform;}

/* gold dust canvas */
.fx-dust{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;}
.hero--page > .wrap,.hero--page .hero-inner{position:relative;z-index:1;}
.hero--home .hero-bg .fx-dust{z-index:1;}

/* ripple on click */
.btn{position:relative;overflow:hidden;isolation:isolate;}
.fx-ripple{position:absolute;border-radius:50%;pointer-events:none;z-index:-1;transform:scale(0);opacity:.55;
  background:radial-gradient(circle, rgba(255,255,255,0.75) 0%, rgba(255,255,255,0.25) 45%, transparent 70%);
  animation:fxRipple .65s ease-out forwards;}
.btn-ghost .fx-ripple{background:radial-gradient(circle, rgba(197,160,89,0.55) 0%, rgba(197,160,89,0.18) 45%, transparent 70%);}
@keyframes fxRipple{to{transform:scale(1);opacity:0;}}

/* magnetic buttons: JS sets the inline transform; this just smooths the return */
.btn.fx-mag{transition:transform .25s cubic-bezier(.2,.7,.3,1), background .15s ease, border-color .15s ease, color .15s ease;}

/* parallax targets */
.fx-parallax{will-change:transform;}

/* hero video safety: the still (identical to the video's last frame) always sits
   behind the video, and replaces it once the video ends - so the hero can never
   go blank when the browser drops a stopped video's frame */
.hero--home .hero-bg{background:#000 url("hero-poster.jpg?v=2") center 22% / cover no-repeat;}
.hero--home .hero-bg video.fx-ended{visibility:hidden;}

/* team cards: uniform 4:5 portraits in a gold frame that gently floats */
.team-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,2.6vw,34px);list-style:none;margin:0;padding:0;}
.team-card{display:grid;gap:16px;justify-items:center;text-align:center;}
.team-float{width:100%;}
.team-photo{position:relative;width:100%;aspect-ratio:4/5;border-radius:16px;overflow:hidden;background:#000;
  border:3px solid var(--gold);
  box-shadow:0 0 0 7px rgba(197,160,89,0.18), 0 25px 55px rgba(0,0,0,0.55), 0 0 26px rgba(197,160,89,0.18);
  transition:transform .45s cubic-bezier(.2,.7,.3,1), box-shadow .45s ease;}
.team-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease;}
.team-photo::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(115deg, transparent 35%, rgba(255,236,190,0.28) 50%, transparent 65%);
  transform:translateX(-120%);transition:transform .9s ease;}
.team-card:hover .team-photo{transform:translateY(-8px);
  box-shadow:0 0 0 7px rgba(197,160,89,0.3), 0 34px 60px rgba(0,0,0,0.6), 0 0 40px rgba(197,160,89,0.38);}
.team-card:hover .team-photo img{transform:scale(1.04);}
.team-card:hover .team-photo::after{transform:translateX(120%);}
.team-name{font-size:1.2rem;font-weight:800;color:var(--paper);margin:0;}
.team-role{font-size:.95rem;font-weight:400;color:var(--gold-soft);line-height:1.55;max-width:26ch;margin:0;}
.team-more{text-align:center;margin-top:40px;}
@media (prefers-reduced-motion: no-preference){
  .team-float{animation:teamFloat 6s ease-in-out infinite;}
  .team-card:nth-child(2) .team-float{animation-delay:-1.5s;}
  .team-card:nth-child(3) .team-float{animation-delay:-3s;}
  .team-card:nth-child(4) .team-float{animation-delay:-4.5s;}
}
@keyframes teamFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}
@media (max-width:1000px){ .team-grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:44px;} }
@media (max-width:560px){ .team-grid{grid-template-columns:minmax(0,300px);justify-content:center;} }
.lede{max-width:74ch;margin-inline:auto;text-align:center;font-size:1.08rem;font-weight:300;line-height:1.85;}