/* ============================================================
   ABOUT US — company story, team, recognition
   Theme-aware (design tokens).
   ============================================================ */
.about{padding:clamp(28px,5vw,56px) 0 clamp(48px,8vw,88px);}
.about__inner{max-width:1040px;margin:0 auto;}

.about__back{
  display:inline-flex;align-items:center;gap:7px;min-height:44px;margin-bottom:18px;
  font-size:var(--text-sm);font-weight:600;color:var(--fg-2);text-decoration:none;
  transition:color var(--dur) var(--ease);
}
.about__back:hover{color:var(--accent);}
.about__back svg{width:16px;height:16px;}

/* hero */
.about-hero{max-width:760px;margin:0 0 clamp(36px,6vw,64px);}
.about-hero .marker{margin-bottom:14px;}
.about-hero__title{
  font-family:var(--font-display);font-weight:800;line-height:1.06;color:var(--fg-strong);
  font-size:clamp(2.1rem,1.5rem+2.6vw,3.1rem);margin:0 0 16px;
}
.about-hero__lead{font-size:clamp(1.02rem,.98rem+.3vw,1.18rem);line-height:1.6;color:var(--fg-2);margin:0 0 24px;}

/* section heading */
.about-h{
  font-family:var(--font-display);font-weight:700;color:var(--fg-strong);
  font-size:clamp(1.4rem,1.2rem+.8vw,1.9rem);line-height:1.15;margin:0 0 6px;
}
.about-sub{color:var(--fg-2);font-size:var(--text-sm);line-height:1.55;margin:0 0 24px;max-width:60ch;}
.about-block{margin:clamp(40px,7vw,72px) 0 0;}

/* story — three beats */
.story{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;}
.story__step{
  position:relative;padding:22px 22px 24px;border:1px solid var(--border);border-radius:var(--r-lg);
  background:var(--surface);box-shadow:var(--shadow-sm);
}
.story__n{
  display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;margin-bottom:14px;
  border-radius:var(--r-sm);background:var(--signal-bg);border:1px solid var(--border-accent);
  color:var(--accent);font-family:var(--font-mono);font-weight:700;font-size:.9rem;
}
.story__t{font-family:var(--font-display);font-weight:700;color:var(--fg-strong);font-size:1.05rem;margin:0 0 8px;}
.story__d{color:var(--fg-2);font-size:var(--text-sm);line-height:1.6;margin:0;}

/* team grid — flip cards (front: profile · back: contact) */
.team{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:18px;}
.tm-card{
  position:relative;min-height:392px;perspective:1200px;cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.tm-card:focus-visible{outline:none;}
.tm-card:focus-visible .tm-face{box-shadow:0 0 0 3px var(--ring),var(--shadow-sm);}
.tm-inner{
  position:relative;width:100%;min-height:392px;
  transition:transform .6s cubic-bezier(.4,0,.2,1);transform-style:preserve-3d;
}
.tm-card.is-flipped .tm-inner{transform:rotateY(180deg);}
/* flip on hover too (like the FAQ cards), on pointer devices */
@media (hover:hover){
  .tm-card:hover .tm-inner{transform:rotateY(180deg);}
}

.tm-face{
  position:absolute;inset:0;display:flex;flex-direction:column;
  padding:24px 22px;border:1px solid var(--border);border-radius:var(--r-lg);
  background:var(--surface);box-shadow:var(--shadow-sm);
  backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;
}
.tm-front{align-items:flex-start;}
.tm-back{transform:rotateY(180deg);}

/* photo */
.tm-photo{
  width:88px;height:88px;border-radius:50%;margin-bottom:14px;flex:none;overflow:hidden;
  background:var(--surface-2);border:2px solid var(--border-accent);
}
.tm-photo img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block;}

.tm-name{font-family:var(--font-display);font-weight:700;color:var(--fg-strong);font-size:1.05rem;margin:0;}
.tm-role{color:var(--accent);font-weight:600;font-size:var(--text-sm);margin:3px 0 0;}
.tm-tag{
  display:inline-block;margin-top:9px;font-family:var(--font-mono);font-size:.62rem;font-weight:700;
  letter-spacing:.07em;text-transform:uppercase;color:var(--fg-muted);
  background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-pill);padding:3px 9px;
}
.tm-bio{color:var(--fg-2);font-size:var(--text-sm);line-height:1.55;margin:12px 0 0;}

/* flip affordance */
.tm-flip{
  position:absolute;top:16px;right:16px;width:26px;height:26px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  color:var(--accent);background:var(--signal-bg);border:1px solid var(--border-accent);
}
.tm-flip svg{width:14px;height:14px;}

/* back face — contact */
.tm-back__lbl{
  font-family:var(--font-mono);font-size:.66rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--fg-muted);margin:0 0 14px;
}
.tm-back .tm-name{font-size:1.02rem;}
.tm-back .tm-role{margin-bottom:18px;}
.tm-links{margin-top:auto;display:grid;gap:10px;}
.tm-link{
  display:flex;align-items:center;gap:10px;min-height:44px;
  color:var(--fg);text-decoration:none;font-size:.84rem;line-height:1.4;
  overflow-wrap:anywhere;word-break:normal;
}
.tm-link:hover{color:var(--accent);}
.tm-link svg{flex:none;width:18px;height:18px;color:var(--accent);}

@media (prefers-reduced-motion:reduce){
  .tm-inner{transition:none;}
}

/* recognition rows */
.recog{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;}
.recog__col{padding:20px 22px;border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface);}
.recog__lbl{
  font-family:var(--font-mono);font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--fg-muted);margin:0 0 12px;
}
.recog__list{margin:0;padding:0;list-style:none;display:grid;gap:9px;}
.recog__list li{display:flex;gap:9px;align-items:flex-start;color:var(--fg);font-size:var(--text-sm);line-height:1.45;}
.recog__list li::before{content:"";flex:none;width:6px;height:6px;margin-top:7px;border-radius:50%;background:var(--accent);}
.recog__list b{color:var(--fg-strong);font-weight:600;}

/* sub-heading inside a block */
.about-h3{
  font-family:var(--font-display);font-weight:700;color:var(--fg-strong);
  font-size:1.1rem;margin:32px 0 6px;
}
.about-h3:first-child{margin-top:0;}

/* award chips */
.award-chips{list-style:none;margin:0 0 8px;padding:0;display:flex;flex-wrap:wrap;gap:10px;}
.award-chips li{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 14px;border:1px solid var(--border-accent);border-radius:var(--r-pill);
  background:var(--signal-bg);color:var(--fg);font-size:var(--text-sm);font-weight:500;
}
.award-chips li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent);flex:none;}

/* supported-by cards */
.support{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;}
.support__card{display:flex;gap:14px;align-items:flex-start;padding:18px 20px;
  border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-sm);}
.support__plate{width:112px;height:112px;flex:none;border-radius:var(--r-md);background:#fff;
  display:flex;align-items:center;justify-content:center;padding:8px;border:1px solid var(--border);}
.support__plate img{width:100%;height:100%;object-fit:contain;}
.support__name{font-family:var(--font-display);font-weight:700;color:var(--fg-strong);font-size:1rem;margin:0;}
.support__year{font-family:var(--font-mono);font-size:.66rem;font-weight:700;letter-spacing:.06em;color:var(--accent);margin:2px 0 6px;}
.support__d{color:var(--fg-2);font-size:var(--text-sm);line-height:1.5;margin:0;}

/* member logo wall */
.orgs__sub{color:var(--fg-muted);font-size:var(--text-sm);margin:0 0 16px;}
.orgs{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;}
.org{
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:11px;
  padding:18px 14px;border:1px solid var(--border);border-radius:var(--r-lg);
  background:var(--surface);text-decoration:none;
  transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),border-color var(--dur) var(--ease);
}
.org:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--border-accent);}
.org:focus-visible{outline:none;box-shadow:0 0 0 3px var(--ring);}
.org__plate{
  width:86px;height:86px;border-radius:var(--r-md);background:#fff;border:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;padding:10px;
}
.org__plate img{
  max-width:100%;max-height:100%;object-fit:contain;
  filter:grayscale(1);opacity:.78;transition:filter var(--dur) var(--ease),opacity var(--dur) var(--ease);
}
.org:hover .org__plate img,.org:focus-visible .org__plate img{filter:none;opacity:1;}
.org__name{font-weight:600;color:var(--fg-strong);font-size:var(--text-sm);line-height:1.25;}
.org__country{font-family:var(--font-mono);font-size:.6rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--fg-muted);}
@media (hover:none){ .org__plate img{filter:none;opacity:1;} }

/* contact card */
.about-contact{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 28px;
  padding:24px 26px;border:1px solid var(--border-accent);border-radius:var(--r-lg);
  background:var(--signal-bg);
}
.about-contact__txt{font-size:var(--text-sm);line-height:1.7;color:var(--fg-2);}
.about-contact__txt strong{color:var(--fg-strong);font-weight:700;}
.about-contact__txt a{color:var(--accent);text-decoration:none;}
.about-contact__txt a:hover{text-decoration:underline;}

@media (max-width:560px){
  .about-contact{flex-direction:column;align-items:flex-start;}
}