/* =========================================================
   our-team.css: styles used ONLY on /our-team
   founder, standards at a glance, roles, faces, building goals
   ========================================================= */
.tm{--spring:cubic-bezier(.34,1.56,.64,1);position:relative;overflow:hidden;background:linear-gradient(var(--sky) 0,#F3F7FF 420px,#fff 100%);padding:clamp(36px,5vw,64px) 20px clamp(80px,10vw,130px)}
.tm>.cloud{left:0;animation:cdrift var(--t) linear var(--dl) infinite backwards}   /* clouds always glide in from off-screen */
.tm section{position:relative;z-index:2;max-width:1160px;margin:clamp(88px,7vw,140px) auto 0}
.i{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}

/* ---------- Title ---------- */
.hd{position:relative;z-index:2;max-width:1240px;margin:0 auto;text-align:center}
.hd h1{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-end;gap:0 .2em;font:700 clamp(3.6rem,16vw,5.8rem)/.95 var(--serif);font-variation-settings:"SOFT" 100;letter-spacing:-.025em}
.m{display:inline-block;overflow:hidden;vertical-align:bottom;padding:.06em .06em .2em;margin:-.06em -.06em -.2em}
.m>span{display:block;animation:rise .95s cubic-bezier(.2,.8,.2,1) backwards;animation-delay:calc(.2s + var(--i)*.14s)}
.pals{width:1.15em;height:auto;margin-bottom:.06em;rotate:5deg;overflow:visible;filter:drop-shadow(0 8px 10px rgba(42,27,69,.16));animation:pop .7s var(--spring) .9s backwards,bob 4s ease-in-out 1.6s infinite}
.hd .lead{max-width:36rem;margin:22px auto 0;font-size:clamp(1.1rem,1.6vw,1.25rem);line-height:1.6;color:var(--muted)}

/* section headings */
.sh{text-align:center;max-width:42rem;margin:0 auto clamp(32px,5vw,56px)}
.sh h2,.fdr h2{font:700 clamp(2rem,4.6vw,3.2rem)/1.05 var(--serif);font-variation-settings:"SOFT" 100;letter-spacing:-.02em}
.sh p{margin-top:14px;font-size:1.12rem;line-height:1.65;color:var(--muted)}

/* ---------- Founder ---------- */
.fdr{display:grid;grid-template-columns:minmax(0,1fr);gap:64px;align-items:center}
.fp{position:relative;max-width:380px;width:100%;margin:0 auto;rotate:-2deg;transition:rotate .55s var(--spring),translate .55s var(--spring)}
.fp:hover{rotate:0deg;translate:0 -8px}
.tm .ph{position:relative;aspect-ratio:var(--ar,1);padding:6px;background:#fff;border-radius:var(--rad,50%);box-shadow:0 22px 38px -22px rgba(42,27,69,.55)}
.tm .ph:hover{rotate:0deg;scale:1}
.tm .ph .in{position:absolute;inset:6px;width:auto;height:auto;border-radius:inherit}
.tm .ph .in svg{width:22%;max-width:72px}
.fp .ph{--ar:4/5;--rad:999px 999px 36px 36px}
.fp .tag{position:absolute;z-index:2;left:50%;bottom:-24px;translate:-50% 0;rotate:2deg;display:flex;flex-direction:column;align-items:center;padding:12px 24px;border-radius:26px;background:#fff;white-space:nowrap;box-shadow:0 14px 26px -12px rgba(42,27,69,.5)}
.tag b{font:700 1.15rem/1.15 var(--serif);font-variation-settings:"SOFT" 100}
.tag span{font-size:.9rem;color:var(--muted)}
.fdr-txt .big{margin-top:18px;font:600 clamp(1.3rem,2.2vw,1.7rem)/1.4 var(--serif);font-variation-settings:"SOFT" 100;letter-spacing:-.01em}
.fdr-txt p{margin-top:14px;font-size:1.08rem;line-height:1.75;color:var(--muted)}
.fdr-txt .big+p{margin-top:16px}

.letter{position:relative;margin-top:34px;padding:clamp(26px,3.6vw,40px) clamp(24px,3.6vw,40px) clamp(24px,3vw,32px);background:#fff;border-radius:32px;box-shadow:0 22px 40px -26px rgba(42,27,69,.45)}
.letter::before{content:"\201C";position:absolute;top:-6px;right:26px;font:700 7rem/1 var(--serif);color:var(--pinkt)}
.letter h3{position:relative;font:700 1.4rem/1.2 var(--serif);font-variation-settings:"SOFT" 100}
.letter p{position:relative}
.sig{margin-top:18px;font:700 1.1rem/1.3 var(--serif);color:var(--pink)!important}
.more summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:10px;margin-top:18px;padding:10px 18px;border-radius:999px;background:var(--pinkt);color:#B30F74;font-weight:700;transition:background .2s}
.more summary::-webkit-details-marker{display:none}
.more summary::after{content:"+";font-size:1.25rem;line-height:1;transition:rotate .3s var(--spring)}
.more[open] summary::after{rotate:45deg}
.more summary:hover{background:#FFC7E6}

/* ---------- The Director's Blog card (under the founder photo) ---------- */
.blog{display:block;padding:clamp(24px,3vw,30px);background:var(--sky);border-radius:30px;rotate:1.2deg;box-shadow:0 22px 40px -28px rgba(42,27,69,.5);transition:rotate .45s var(--spring),translate .45s var(--spring)}
.blog:hover{rotate:0deg;translate:0 -6px}
.blog .bd{background:#fff;color:var(--blue)}
.blog h3{margin-top:16px;font:700 1.45rem/1.15 var(--serif);font-variation-settings:"SOFT" 100}
.blog p{margin-top:8px;line-height:1.6;color:var(--muted)}
.blog .btn{margin-top:20px}

/* ---------- Standards at a glance ---------- */
.stats{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:16px}
.stats li{padding:26px 14px 24px;text-align:center;background:var(--pinkt);border-radius:30px;rotate:var(--r);transition:rotate .45s var(--spring),translate .45s var(--spring)}
.stats li:nth-child(even){background:var(--sky)}
.stats li:hover{rotate:0deg;translate:0 -5px}
.stats strong{display:block;font:700 clamp(2.4rem,5vw,3.6rem)/1 var(--serif);font-variation-settings:"SOFT" 100;color:var(--pink)}
.stats li:nth-child(even) strong{color:var(--blue)}
.stats span{display:block;margin-top:10px;font-weight:500;line-height:1.35}

/* ---------- Roles ---------- */
.roles{list-style:none;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:28px}
.role{padding:clamp(24px,3.4vw,34px);background:#fff;border-radius:34px;box-shadow:0 22px 40px -26px rgba(42,27,69,.45);rotate:var(--r);transition:rotate .45s var(--spring),translate .45s var(--spring)}
.role:hover{rotate:0deg;translate:0 -6px}
.bd{display:grid;place-items:center;width:60px;height:60px;border-radius:50%;background:var(--pinkt);color:var(--pink)}
.role:nth-child(2) .bd{background:var(--sky);color:var(--blue)}
.bd .i{width:32px;height:32px}
.role h3{margin-top:18px;font:700 1.5rem/1.15 var(--serif);font-variation-settings:"SOFT" 100}
.role>p{margin-top:10px;line-height:1.65;color:var(--muted)}
.role h4{margin-top:20px;font-size:.88rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
.role ul{list-style:none;padding:0;margin-top:10px;display:grid;gap:10px}
.role li{position:relative;padding-left:30px;line-height:1.45}
.role li::before{content:"";position:absolute;left:0;top:.1em;width:20px;height:20px;border-radius:50%;background:var(--pinkt) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m5.5 10.5 3 3 6-6.5' fill='none' stroke='%23DB1B91' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/cover}

/* ---------- Faces ---------- */
.faces{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:34px 18px}
.mem{text-align:center;rotate:var(--r);transition:rotate .45s var(--spring),translate .45s var(--spring)}
.mem:hover{rotate:0deg;translate:0 -6px}
.mem .ph{--rad:50%;max-width:210px;margin:0 auto}
.mem:nth-child(3n+2) .ph{--rad:999px 999px 28px 28px;--ar:4/5}
.mem h3{margin-top:16px;font:700 1.2rem/1.2 var(--serif);font-variation-settings:"SOFT" 100}
.mem p{margin-top:4px;font-size:.98rem;color:var(--muted)}

/* ---------- Building goals (steps up like stacked blocks) ---------- */
.goals{list-style:none;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:22px;align-items:end}
.goal{position:relative;padding:clamp(24px,3.4vw,34px);border-radius:34px;background:var(--pinkt);box-shadow:0 22px 40px -28px rgba(42,27,69,.5);rotate:var(--r);transition:rotate .45s var(--spring),translate .45s var(--spring)}
.goal:nth-child(2){background:var(--sky)}
.goal:nth-child(3){background:#fff}
.goal:hover{rotate:0deg;translate:0 -6px}
.num{display:grid;place-items:center;width:58px;height:58px;border-radius:18px;background:var(--pink);color:#fff;font:700 1.7rem/1 var(--serif);rotate:-6deg;box-shadow:0 10px 18px -8px rgba(219,27,145,.6)}
.goal:nth-child(2) .num{background:var(--blue);rotate:5deg;box-shadow:0 10px 18px -8px rgba(54,119,234,.6)}
.goal:nth-child(3) .num{background:var(--rose);rotate:-4deg}
.goal h3{margin-top:18px;font:700 1.5rem/1.15 var(--serif);font-variation-settings:"SOFT" 100}
.goal p{margin-top:10px;line-height:1.65;color:var(--muted)}

@keyframes rise{from{transform:translateY(115%)}}
@keyframes pop{from{scale:0;opacity:0}}
@keyframes bob{50%{translate:0 -8px}}
@keyframes cdrift{from{transform:translateX(-110%)}to{transform:translateX(100vw)}}

@media (min-width:640px){
  .stats{grid-template-columns:repeat(4,1fr)}
  .faces{grid-template-columns:repeat(4,1fr)}
}
@media (min-width:901px){
  .hd h1{font-size:clamp(6rem,11vw,9.4rem)}
  .fdr{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);grid-template-rows:auto auto 1fr;column-gap:clamp(56px,7vw,100px);row-gap:64px;align-items:start}
  .fdr .fp{grid-column:1;grid-row:1}
  .fdr-txt{grid-column:2;grid-row:1/4}
  .blog{grid-column:1;grid-row:2}
  .roles{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch}
  .goals{grid-template-columns:repeat(3,minmax(0,1fr))}
  .goal:nth-child(1){padding-bottom:clamp(24px,3.4vw,34px)}
  .goal:nth-child(2){margin-bottom:34px}
  .goal:nth-child(3){margin-bottom:68px}
}
