/* About page: office hero, team, who does what (Appro chrome purple) */
.tm-page{padding:104px 0 90px;background:#fff;font-family:Inter,sans-serif;color:#23162f}
.tm-page>section{width:calc(100% - 32px);max-width:1200px;margin-left:auto;margin-right:auto}
.ap-inner-page main.tm-page h1,.ap-inner-page main.tm-page h2,.ap-inner-page main.tm-page h3{font-family:'Fustat','Inter',sans-serif;font-weight:600;letter-spacing:-.03em;color:#23162f;margin:0}
.tm-kicker{margin:0 0 14px;font:600 11px/1.4 Inter,sans-serif;letter-spacing:1.8px;color:#8a6bb0}

/* Hero: the studio photo with copy on a purple fade */
.tm-hero{position:relative;border-radius:30px;overflow:hidden;min-height:clamp(520px,64vw,640px);display:flex;align-items:flex-end;isolation:isolate;box-shadow:0 50px 90px -60px #3d2066aa}
.tm-hero-media{position:absolute;inset:0;z-index:-2}
.tm-hero-media img{width:100%;height:100%;object-fit:cover;object-position:50% 45%;display:block}
.tm-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#1c0d30eb 0%,#24123dbf 30%,#3d206659 50%,#3d206600 66%),linear-gradient(0deg,#1c0d3099,#1c0d3000 38%)}
.tm-hero-copy{padding:clamp(28px,5vw,56px);max-width:620px;color:#fff}
.tm-hero .tm-kicker{color:#c9a7ff}
.ap-inner-page main.tm-page .tm-hero h1{color:#fff;font-size:clamp(40px,6vw,72px);line-height:1.02}
.tm-hero h1 span{background:linear-gradient(110deg,#e6d6ff,#b48cff 60%,#f0c9ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.tm-sub{margin:18px 0 0;font-size:17px;line-height:1.65;color:#e4d6f7;max-width:520px}
.tm-actions{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap}
.tm-btn{display:inline-flex;align-items:center;padding:15px 22px;border-radius:999px;font:600 15px/1 Inter,sans-serif;text-decoration:none;transition:transform .25s ease,background .25s ease}
.tm-btn:hover{transform:translateY(-2px)}
.tm-btn--light{background:#fff;color:#3d2066}
.tm-btn--ghost{border:1px solid #ffffff55;color:#fff}
.tm-btn--ghost:hover{background:#ffffff1a}
.tm-tag{position:absolute;top:18px;right:18px;padding:9px 14px;border-radius:999px;background:#160a26b3;color:#fff;font-size:12.5px;backdrop-filter:blur(8px)}

/* Numbers sit just under the hero */
.tm-numbers{padding-top:28px!important}

/* Office */
.tm-office{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,64px);align-items:start;padding-top:100px}
.ap-inner-page main.tm-page .tm-office h2,.ap-inner-page main.tm-page .tm-team h2,.ap-inner-page main.tm-page .tm-flow h2{font-size:clamp(30px,3.8vw,46px);line-height:1.08}
.tm-team h2 span{color:#9b6bd6}
.tm-office-head p:not(.tm-kicker){margin:16px 0 0;font-size:16.5px;line-height:1.7;color:#6e6079}
.tm-facts{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.tm-fact{padding:22px;border-radius:20px;background:#faf6ff;border:1px solid #ece2f6}
.tm-fact b{display:block;font:600 16px/1.3 'Fustat','Inter',sans-serif;color:#3d2066}
.tm-fact p{margin:6px 0 0;font-size:14.5px;line-height:1.6;color:#6e6079}

/* Team */
.tm-team,.tm-flow{padding-top:100px}
.tm-team-head{margin-bottom:30px}
.tm-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.tm-card{display:flex;flex-direction:column;gap:18px;padding:26px;border-radius:24px;background:#fff;border:1px solid #ece2f6;box-shadow:0 24px 50px -40px #5c2f9a66;transition:transform .25s ease,box-shadow .25s ease}
.tm-card:hover{transform:translateY(-3px);box-shadow:0 30px 60px -40px #5c2f9a88}
.tm-avatar{width:88px;height:88px;border-radius:24px;font-size:34px;display:grid;place-items:center;color:#fff;font:600 22px/1 'Fustat','Inter',sans-serif;background:linear-gradient(135deg,#24123d,#5a3496 70%,#7b52c4);box-shadow:inset 0 1px 0 #ffffff33}
.ap-inner-page main.tm-page .tm-card h3{font-size:22px}
.tm-role{margin:4px 0 10px;font-size:13px;font-weight:600;letter-spacing:.02em;color:#7a4fc0}
.tm-card p:not(.tm-role){margin:0;font-size:14.5px;line-height:1.6;color:#6e6079}

/* Who does what */
.tm-steps{list-style:none;margin:0;padding:34px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;border-radius:28px;color:#fff;background:radial-gradient(120% 90% at 10% -20%,#ffffff1f,transparent 50%),linear-gradient(115deg,#1c0d30,#24123d 30%,#3d2066 65%,#5a3496);counter-reset:s}
.tm-steps li{counter-increment:s;position:relative;padding-top:52px}
.tm-steps li::before{content:"0" counter(s);position:absolute;top:0;left:0;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;border:1px solid #c9adff66;color:#d9c2ff;font:600 13px/1 Inter,sans-serif}
.tm-steps b{display:block;font:600 20px/1.2 'Fustat','Inter',sans-serif}
.tm-steps small{display:inline-block;margin-top:8px;padding:3px 10px;border-radius:999px;background:#ffffff1a;color:#e6d6ff;font-size:12px;font-weight:600}
.tm-steps p{margin:10px 0 0;font-size:14.5px;line-height:1.6;color:#d6c6ec}

.tm-page .au-values{padding-top:100px}

@media (max-width:980px){.tm-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tm-steps{grid-template-columns:1fr 1fr}.tm-office{grid-template-columns:1fr}}
@media (max-width:600px){
  .tm-page{padding-top:92px}
  .tm-hero{border-radius:22px;min-height:0;display:block;background:linear-gradient(160deg,#1c0d30,#24123d 55%,#3d2066)}
  .tm-hero::before{display:none}
  .tm-hero-media{position:relative;inset:auto;z-index:auto;aspect-ratio:4/3.1}
  .tm-hero-copy{padding:24px 22px 26px}
  .ap-inner-page main.tm-page .tm-hero h1{font-size:clamp(34px,9.5vw,42px)}
  .tm-sub{font-size:15.5px;margin-top:12px}
  .tm-actions{margin-top:20px}
  .tm-numbers dl{gap:10px!important}
  .tm-numbers dl div{padding:18px 10px!important;border-radius:18px!important}
  .tm-numbers dt{font-size:34px!important}
  .tm-numbers dd{font-size:12.5px!important;margin-top:6px!important}
  .tm-actions{flex-direction:column}.tm-btn{justify-content:center}
  .tm-tag{top:12px;right:12px;font-size:11.5px}
  .tm-facts,.tm-grid,.tm-steps{grid-template-columns:1fr}
  .tm-steps{padding:24px}
  .tm-office,.tm-team,.tm-flow,.tm-page .au-values{padding-top:72px}
}

.tm-avatar--photo{background:#e9dcfb;overflow:hidden;box-shadow:0 14px 28px -18px #3d2066aa}
.tm-avatar--photo img{width:100%;height:100%;object-fit:cover;display:block}