/* Team cards share the site's calm palette and spatial modal. */
#site-menu [data-page="team"]{--hover-color:#e9a66f}
#information.is-team{width:min(1040px,calc(100vw - 36px));height:min(680px,calc(100dvh - 48px))}
#information.is-team .panel{padding:46px 32px 26px}
#information.is-team .panel-label{color:#e9a66f;margin-bottom:12px}
#information.is-team h2{margin-bottom:10px}
#information.is-team #card-content{overflow-y:auto;min-height:0}
.team-row{display:flex;justify-content:center;gap:18px;overflow-x:auto;padding:4px 4px 16px;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#a7b6e8 transparent}
.team-item{flex:0 0 min(210px,calc((100% - 54px)/4));min-width:0;scroll-snap-align:center}
.team-card{display:block;width:100%;height:350px;border:0;padding:0;border-radius:16px;background:transparent;color:#292c2c;text-align:left;cursor:pointer;perspective:1100px;font:inherit}
.team-card-inner{position:relative;display:block;width:100%;height:100%;transform-style:preserve-3d;transition:transform 1s cubic-bezier(.4,0,.2,1)}
.team-card.is-flipped .team-card-inner{transform:rotateY(180deg)}
.team-face{position:absolute;inset:0;display:flex;flex-direction:column;overflow:hidden;border:1px solid #a7b6e866;border-radius:16px;background:#fcfbf8;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:0 3px 6px #292c2c24,0 6px 11px #292c2c1b}
.team-portrait{position:relative;display:block;flex:1;min-height:0;overflow:hidden}
.team-portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 25%;display:block}
.team-photo{filter:grayscale(1);transition:filter .7s ease}
@media(hover:hover){.team-card:hover .team-photo{filter:grayscale(0)}}
.team-card:focus-visible .team-photo{filter:grayscale(0)}
.team-card:focus-visible{outline:2px solid #697aab;outline-offset:4px}
.team-caption{display:block;padding:14px 14px 0}
.team-name{display:block;font-family:Comfortaa,Arial,sans-serif;font-size:14px;line-height:1.5;font-weight:400;overflow-wrap:anywhere}
.team-role{display:block;min-height:18px;font-size:11px;line-height:1.6;color:#747983;letter-spacing:.08em;margin-top:4px}
.team-hint{display:block;padding:10px 14px 14px;font-size:10px;color:#757c8d;letter-spacing:.03em}
.team-back{transform:rotateY(180deg);padding:22px 16px;background:linear-gradient(145deg,#fbfbfd,#edf0f8)}
.team-back-label{font-size:9px;letter-spacing:.15em;color:#697aab;margin-bottom:20px}
.team-bio{display:block;flex:1;border-top:1px solid #a7b6e866;margin-top:18px}
.team-back .team-hint{padding:12px 0 0}
@media(max-width:760px){.team-row{justify-content:flex-start}.team-item{flex:0 0 190px}.team-card{height:340px}}
@media(max-width:480px){#information.is-team .panel{padding:48px 22px 22px}#information.is-team{width:calc(100vw - 24px);height:calc(100dvh - 28px);max-height:calc(100dvh - 28px)}.team-item{flex-basis:200px}}
@media(prefers-reduced-motion:reduce){.team-card-inner,.team-photo{transition:none}}

/* Clip the rotating card, not its preserve-3d inner element. */
.team-card{position:relative;overflow:hidden}
.team-row{overflow-y:hidden;scrollbar-width:none}
.team-row::-webkit-scrollbar{display:none;width:0;height:0}
.team-card::after{content:'';position:absolute;inset:0;z-index:2;border-radius:inherit;padding:2.5px;pointer-events:none;opacity:0;background:linear-gradient(135deg,transparent 35%,#00d7ffe8 43%,#9a70e8f0 48%,#ff48b8f0 52%,#c1ee57e8 57%,transparent 65%);background-size:300% 300%;background-position:100% 100%;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.team-card:hover::after,.team-card:focus-visible::after{animation:team-border-shimmer var(--shimmer-duration,1.5s) ease-out 1 both}
@keyframes team-border-shimmer{0%{opacity:0;background-position:100% 100%}15%{opacity:1}80%{opacity:.9}100%{opacity:0;background-position:0% 0%}}
@media(prefers-reduced-motion:reduce){.team-card:hover::after,.team-card:focus-visible::after{animation:none}}

.team-linkedin-placeholder{position:absolute;right:16px;bottom:22px;width:22px;height:22px;object-fit:contain;opacity:.7}
.team-back .team-hint{padding-right:32px}

/* Independent flip and profile controls, with room for the lifting card. */
.team-row{padding:36px 12px 50px;gap:18px}
.team-card{overflow:visible;transition:transform .6s ease;background:transparent}
.team-card-inner{transition:none}
.team-face,.team-back{background:#f7f6f3}
.team-flip-control,.team-flip-control:hover,.team-flip-control:active{position:absolute;inset:0;z-index:3;display:block;width:100%;height:100%;padding:0;border:0;border-radius:16px;background:transparent;box-shadow:none;cursor:pointer}
.team-flip-control:focus-visible{outline:2px solid #697aab;outline-offset:4px}
.team-linkedin{position:absolute;right:10px;bottom:12px;z-index:4;width:36px;height:36px;display:grid;place-items:center;transition:transform .4s ease;transform-origin:center}
.team-linkedin[hidden]{display:none}
.team-linkedin img{width:22px;height:22px;transition:none}
.team-linkedin:hover,.team-linkedin:focus-visible{transform:scale(1.15)}
.team-linkedin:hover img,.team-linkedin:focus-visible img{filter:invert(29%) sepia(94%) saturate(1420%) hue-rotate(176deg) brightness(88%) contrast(101%)}
.team-linkedin:focus-visible{outline:2px solid #0a66c2;border-radius:6px}
.team-card:has(.team-flip-control:focus-visible) .team-photo,.team-card.is-centered .team-photo{filter:grayscale(0)}
.team-card:has(.team-flip-control:focus-visible)::after,.team-card.is-centered::after{animation:team-border-shimmer var(--shimmer-duration,1.5s) ease-out 1 both}
.team-card.is-centered .team-face{border-color:#a7b6e8}
.team-card.is-turning::after{opacity:0;animation:none}
.team-swipe-hint{display:none;text-align:center;color:#757c8d;font-size:12px;letter-spacing:.04em;padding:0 0 12px}
@media(hover:hover) and (pointer:fine){.team-card:hover{transform:scale(1.025)}}
@media(hover:none),(pointer:coarse){.team-row{justify-content:flex-start;padding-inline:max(12px,calc((100% - 200px)/2));scroll-padding-inline:max(12px,calc((100% - 200px)/2))}.team-item{flex:0 0 200px}.team-swipe-hint{display:block}.team-card.is-centered{transform:scale(1.025)}.team-card:hover::after{animation:none}.team-card.is-centered::after{animation:team-border-shimmer var(--shimmer-duration,1.5s) ease-out 1 both}}
@media(prefers-reduced-motion:reduce){.team-card,.team-linkedin,.team-linkedin img{transition:none}.team-card:hover,.team-card.is-centered{transform:none}.team-card:has(.team-flip-control:focus-visible)::after,.team-card.is-centered::after{animation:none}}

/* Swap only the black SVG fill; keep white lettering unchanged. */
.team-linkedin:hover img,.team-linkedin:focus-visible img{filter:none;content:url("images/social-linkedin-blue.svg")}
.team-bio{padding-top:12px;font-size:12px;line-height:1.6;color:#585c5c;overflow-wrap:break-word;min-height:0}

/* Keep the profile link on the rotating back face, above the flip hit target. */
.team-card-inner{z-index:4;pointer-events:none}
.team-card::after{z-index:5}
.team-linkedin{pointer-events:none}
.team-card.is-flipped:not(.is-turning) .team-linkedin{pointer-events:auto}

/* Measure usable modal space; retain padding for lifted cards. */
.team-card{height:var(--team-card-height,350px)}
.team-gallery.is-compact .team-back{padding-top:16px;padding-bottom:16px}
.team-gallery.is-compact .team-back-label{margin-bottom:12px}
.team-gallery.is-compact .team-bio{margin-top:12px;padding-top:10px;font-size:11.5px;line-height:1.5}
#information.is-team .card-navigation{margin-top:18px}

/* Touch cards use centered selection instead of a potentially sticky hover. */
@media(hover:none),(pointer:coarse){
  .team-card:not(.is-centered) .team-linkedin img{filter:none;content:url("images/social-linkedin.svg?v=charcoal-1")}
  .team-card.is-centered .team-linkedin img{filter:none;content:url("images/social-linkedin-blue.svg")}
}


