/* Team coverflow (from team-coverflow.html), palette matched to the new theme */
/* ===== Team page: swipeable 3D coverflow, mobile-first ===== */
.cf{--cf-teal:#14b8a6;--cf-orange:#ff7d5c;--cf-ink:#062f3a;--cw:clamp(170px,56vw,250px);--gx:calc(var(--cw)*.72);position:relative;max-width:1100px;margin:0 auto;padding:.5rem 0 2.5rem;text-align:center}
@media (min-width:761px){.cf{--cw:clamp(210px,23vw,270px);--gx:calc(var(--cw)*.8)}}
.cf-glow{position:absolute;left:50%;top:8%;width:min(92%,760px);height:62%;transform:translateX(-50%) rotate(var(--rot,0deg));border-radius:50%;filter:blur(70px);opacity:.42;pointer-events:none;transition:transform 1.2s cubic-bezier(.2,.8,.2,1);background:radial-gradient(circle at 25% 50%,var(--cf-teal),transparent 60%),radial-gradient(circle at 75% 50%,var(--cf-orange),transparent 60%)}
.cf-stage{position:relative;height:calc(var(--cw)*1.34 + 34px);perspective:1100px;overflow:hidden;touch-action:pan-y;user-select:none;-webkit-user-select:none;outline:none}
.cf-stage:focus-visible{box-shadow:0 0 0 3px var(--cf-teal);border-radius:16px}
.cf-c{position:absolute;left:50%;top:17px;width:var(--cw);aspect-ratio:3/4;margin-left:calc(var(--cw)/-2);border-radius:24px;overflow:hidden;cursor:pointer;background:linear-gradient(160deg,var(--cf-ink),var(--cf-teal));box-shadow:0 26px 44px -20px rgba(6,47,58,.7);transform:translateX(calc(var(--o,0)*var(--gx))) translateZ(calc(var(--ao,0)*-120px)) rotateY(calc(var(--o,0)*-34deg)) scale(calc(1 - var(--ao,0)*.06));z-index:calc(10 - var(--ao,0));transition:transform .85s cubic-bezier(.2,.8,.2,1),opacity .6s,box-shadow .6s}
.cf-c[data-ao="0"]{box-shadow:0 0 0 3px var(--cf-orange),0 34px 56px -22px rgba(6,47,58,.8)}
.cf-c[data-ao="2"]{opacity:.45}
.cf-c[data-ao="3"],.cf-c[data-ao="4"]{opacity:0;pointer-events:none}
@media (max-width:760px){.cf-c[data-ao="2"]{opacity:0;pointer-events:none}}
.cf-c::before{content:attr(data-i);position:absolute;inset:0;display:grid;place-items:center;font:800 3.2rem/1 'Fraunces',system-ui,sans-serif;color:#fff;opacity:.85}
.cf-c img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 20%;pointer-events:none;-webkit-user-drag:none;filter:grayscale(.85) brightness(.7);transform:scale(1.12);transition:filter .8s,transform 1.4s cubic-bezier(.2,.8,.2,1)}
.cf-c[data-ao="0"] img{filter:none;transform:scale(1.02)}
.cf-c::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(to top,rgba(3,24,32,.55),transparent 40%),linear-gradient(115deg,transparent 35%,rgba(255,255,255,.3) 50%,transparent 65%);background-size:100% 100%,250% 100%;background-position:0 0,160% 0}
.cf-c[data-ao="0"]::after{animation:cf-shine 1.4s .35s ease-out both}
@keyframes cf-shine{from{background-position:0 0,160% 0}to{background-position:0 0,-60% 0}}
.cf-no{position:absolute;z-index:2;top:12px;left:16px;font:800 2rem/1 'Fraunces',system-ui,sans-serif;color:transparent;-webkit-text-stroke:1.5px #fff;transition:color .5s,-webkit-text-stroke-color .5s}
.cf-c[data-ao="0"] .cf-no{color:var(--cf-orange);-webkit-text-stroke-color:var(--cf-orange)}

.cf-cap{position:relative;margin-top:.4rem;min-height:5.6rem;padding:0 3.4rem}
.cf-rl{display:inline-block;padding:.32rem .9rem;border-radius:999px;background:var(--cf-orange);color:#2a1500;font-weight:600;font-size:.95rem}
.cf-nm{margin-top:.55rem;font:800 clamp(1.4rem,5vw,2.3rem)/1.12 'Fraunces',system-ui,sans-serif}
.cf-cap.swap .cf-rl{animation:cf-pop .55s cubic-bezier(.3,1.5,.5,1) both}
.cf-cap.swap .cf-nm{animation:cf-up .6s .08s cubic-bezier(.2,.8,.2,1) both}
@keyframes cf-pop{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@keyframes cf-up{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.cf-ar{position:absolute;top:50%;width:44px;height:44px;margin-top:-22px;border-radius:50%;border:2px solid var(--cf-teal);background:transparent;color:inherit;font-size:1.3rem;line-height:1;cursor:pointer;display:grid;place-items:center;transition:background .3s,color .3s,transform .3s}
.cf-ar:hover,.cf-ar:focus-visible{background:var(--cf-teal);color:#fff;transform:scale(1.08)}
.cf-ar.p{left:0}.cf-ar.n{right:0}
.cf-nav{display:flex;justify-content:center;gap:.6rem;margin-top:1rem}
.cf-dot{position:relative;min-width:46px;height:34px;padding:0 .7rem;border-radius:999px;border:2px solid color-mix(in srgb,currentColor 25%,transparent);background:transparent;color:inherit;font:700 .85rem 'Fraunces',system-ui,sans-serif;cursor:pointer;overflow:hidden;transition:min-width .5s cubic-bezier(.2,.8,.2,1),border-color .3s}
.cf-dot.on{min-width:74px;border-color:var(--cf-orange)}
.cf-dot::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:0;background:linear-gradient(90deg,var(--cf-teal),var(--cf-orange))}
.cf-dot.on.run::after{animation:cf-fill var(--cf-dur,4s) linear forwards}
@keyframes cf-fill{to{width:100%}}

/* entrance: cards start stacked in the middle, then fan out */
.cf-js .cf:not(.in) .cf-c{transform:translateX(0) translateZ(-200px) scale(.7);opacity:0}
.cf-js .cf:not(.ready) .cf-c{transition-delay:calc(var(--i)*.12s)}
@media (prefers-reduced-motion:reduce){.cf *,.cf *::before,.cf *::after{animation:none!important;transition:none!important}}

/* extras: initials fallback when a photo is missing, dark mode */
.cf-c.noimg::before{opacity:.9}
.cf-c img+.cf-no{}
:root[data-t=dark] .cf-c[data-ao="0"]{box-shadow:0 0 0 3px var(--cf-orange),0 34px 56px -22px rgba(0,0,0,.9)}
.cf-glow{opacity:.34}